CSS

スポンサーリンク
HTML

dl dt dd の横並びと縦並び スマートフォンとPCでの表示の切り替え Prog-lab

Prog-labの趣旨は解説よりも、メモ置き場に近い情報コーナーです。 タグの各意味と説明、目的 dl,dt,ddを用い、tableのように横並びに表示させる。スマートフォンなどについてはdd,dtで改行させる。 dl 説明リスト dt 説明たしい用語 dd 説明 用語が上揃えとなるパターン 下線(border-bot...
HTML&CSSリファレンス

dtとddの間で改行しない コピペで使えるHTML+CSS

用語の説明などで用いられる<dt>はブロックレベル要素ですから、原則として横並びにはできない。ここでは改行をせず、きれいに横並び、かつ、縦方向にも揃えて表示する方法について解説します。
メモ

WordPressのtableに勝手にheightが指定されてしまう問題

※メモ程度の記述です。ご了承ください。 table tr td thなどにheight指定が入る wordpressで表を作って保存をし、後で作り直そうとすると、 勝手にheightが指定されてしまっている問題です。 全部手動でheightを消す必要はありません。 この問題についてはcssで解決します。 カスタムCSS...
スポンサーリンク
HTML&CSSリファレンス

スクロールするとdivが表示されるようにする コピペで使えるHTML+CSS+JavaScript

無効なテキストを指定するS要素の修正。一般的なブラウザでは文字の中央に打消し線が引かれるS要素。text-decorationを修正して線の種類や太さ、色を変更します。
HTML&CSSリファレンス

ブラウザ右下に常に文章やBOX(div)を表示する コピペで使えるHTML+CSS

無効なテキストを指定するS要素の修正。一般的なブラウザでは文字の中央に打消し線が引かれるS要素。text-decorationを修正して線の種類や太さ、色を変更します。
HTML&CSSリファレンス

画像を加工せずに切り抜き表示する コピペで使えるHTML+CSS

無効なテキストを指定するS要素の修正。一般的なブラウザでは文字の中央に打消し線が引かれるS要素。text-decorationを修正して線の種類や太さ、色を変更します。
HTML&CSSリファレンス

CSSのみで縦型の棒グラフをつくる コピペで使えるHTML+CSS グラフ編

無効なテキストを指定するS要素の修正。一般的なブラウザでは文字の中央に打消し線が引かれるS要素。text-decorationを修正して線の種類や太さ、色を変更します。
HTML&CSSリファレンス

CSSのみで円グラフをつくる コピペで使えるHTML+CSS グラフ編

無効なテキストを指定するS要素の修正。一般的なブラウザでは文字の中央に打消し線が引かれるS要素。text-decorationを修正して線の種類や太さ、色を変更します。
HTML&CSSリファレンス

漢字を含む日本語全角文字を斜め斜体にする コピペで使えるHTML+CSS

ここでは文字の斜体化について説明します。em要素を適用することで斜体化されるわけですが、この方法では漢字や平仮名といった全角文字は斜めになりません。多くの日本語フォントが斜体を用意していないためです。そこで、全く別の方法によって、全角文字を斜体化します。 HTML全角文字の斜体化メーカー 文章を入力→コードを取得でHT...
HTML&CSSリファレンス

デザイン自由自在のdivドロップダウンメニューをCSSのみで実現 コピペで使えるHTML+CSS

リスト構造を用いず、divを用いることで、自在なデザインが可能なドロップダウンメニュー(プルダウンメニュー)を実装します。:hoverの重ね掛けで実現します。Chrome、Edge、Opera、Firefoxで確認済。実際に実装する際はスマートフォン向けに@mediaを使って低解像度向けにwidthを狭く指定するか、又...
HTML&CSSリファレンス

三角形や不等号など文字の向きを変える コピペで使えるHTML+CSS

三角の▲、不等号の>といった記号や文字の表示の方向を変えます。見出しや、文の初めなどに配置して文章にアクセントを加えることができます。 ▲の向きを変える ▲を右向きにする ▲を右向きにしますと、 ▲ となります style属性で記述 <span>▲を右向きにしますと、</span> <span style="displ...
HTML&CSSリファレンス

まとめ箇条書き表リスト コピペで使えるHTML+CSS

ブログなどの文末によくある要点をまとめた箇条書きや一覧を、順不同リスト<ul>、<li>を使って作成します。箇条書き黒板のデザインも再現します。
HTML&CSSリファレンス

table 角丸の表を作成する 内側の壁紙問題も対応 コピペで使えるHTML+CSS

CSSのborder-radiusを使ってtable表の外周について角を丸くします。しっかりと丸みを持たせるためにテーブル内のセルをどのように処理するかについて、first-childとlast-childを実装した汎用性の高い設計も解説します。
HTML&CSSリファレンス

CSS トラブルQ&A コピペで使えるHTML+CSS

CSS トラブル Q&A いくつかのトラブルについてのテクニックなどをメモしておく。 overflow:hiddenについて CSSが効かない、挙動がおかしい → overflow:clipに変更するとうまくゆくことがある。
HTML&CSSリファレンス

border 枠線の表示 コピペで使えるHTML+CSS

CSSで要素の枠線を引くborderプロパティの説明、solidからhidde,outsetまで全てを網羅した解説を掲載。borderの高さは調整できるのか? ::beforeセレクターとの違いも説明。
メモ

WordPressのサイドバーの文字の大きさやカテゴリーの行間を変更する

※メモ程度の記述です。ご了承ください。 変更したい記述を見つける cssの変更場所を見つけ出す場合に最も簡単な方法がchromeブラウザでF12を押して、ソースコードを表示させる方法です。左側と右側を見比べながら探し出します。コードに対応する描写に色が付きます。 実際にどの値で行間を指定しているか、文字の大きさが指定さ...