カテゴリー別一覧: CSS

色の指定にはなぜ先頭に#を付けるの?

文字列ではなく色を指定するための数値だということを示すためです。 左から順に、赤、緑、青の値を2桁の16進数で示しています。 テレビやパソコンの画面では、光の3原色であるレッド(R)、グリーン(G)、ブルー(B)を組み合 … 続きを読む

カテゴリー: CSS, HTMLの基礎知識, ナレッジノート |

emとex、pxとptの違いは何?

emとexでは基準にする文字の高さ、pxとptは基準にする細かさが違います。 emは1文字、exは小文字xが基準。pxは画面表示の1点分、ptは1/72インチです。 CSSで利用される単位のemとexは、どちらも文字サイ … 続きを読む

カテゴリー: CSS, HTMLの基礎知識, ナレッジノート |

CSSで使える単位まとめ[CSS]

cm、mm、in、pt、pc、em、ex、px、%と全部で9種類あります。 日本語のページデザインでは、em、px、%がよく利用されています。 CSSでは、要素の大きさや余白、ボーダー、文字サイズなどの指定にさまざまな単 … 続きを読む

カテゴリー: CSS, HTMLの基礎知識, ナレッジノート |

レイアウトの幅?[CSS]

margin、paddingやwidthの値に、borderの幅も含めて計算します。 ショートハンドでまとめて指定している場合は、左右の合計値になるように値を2倍にします。 CSSでホームページをレイアウトする場合、コン … 続きを読む

カテゴリー: CSS, HTMLの基礎知識, ナレッジノート |

marginとpaddingの違いは?[CSS]

ボーダーの内側がpadding、外側がmarginです。背景色や背景画像はpaddingの範囲まで表示されます。marginには負の値が指定できます。 CSSでデザインするときにとまどう事のひとつが余白の扱い方です。CS … 続きを読む

カテゴリー: CSS, HTMLの基礎知識, ナレッジノート |

ショートハンドまとめ例[CSS]

ショートハンドまとめの指定例 backgroundの場合 [css] body { background-color: #FC0; background-image: url(bk.jpg); background-re … 続きを読む

カテゴリー: CSS, HTMLの基礎知識, ナレッジノート |

ショートハンドって?[CSS]

同類の複数プロパティをまとめて指定できるプロパティです。背景色やフォント、ボーダー、マージン、パディング、リストでまとめて指定できます。 CSSのプロパティには、よく似た種類によって、細かく分類されているものがあります。 … 続きを読む

カテゴリー: CSS, HTMLの基礎知識, ナレッジノート |

プロパティ値の継承について[CSS]

継承されるプロパティとそうでないプロパティがあります。 継承されないプロパティは、値にinheritを指定して強制的に継承することもできます。 CSSでは、プロパティによっては、スタイルの値が子要素などの下の階層に継承さ … 続きを読む

カテゴリー: CSS, HTMLの基礎知識, ナレッジノート |

クラスとIDの違い

ページ内で1つしかない要素を特定するのがID、いくつかの仲間が存在するのがクラスです。 divやspan、pなど、同一の(X)HTML内で繰り返し利用される要素は、区別が付きやすいように属性で分類したり、名前を付けたりし … 続きを読む

カテゴリー: CSS, HTML5, HTMLの基礎知識, ナレッジノート, 属性 |

セレクタの優先順位

要素名だけの指定よりも、classやidの値を指定したセレクタ、セレクタを組み合わせた複合セレクタなど、より限定された部分を指定するセレクタが優先されます。 スタイルの指定(CSS) [css] p { color: g … 続きを読む

カテゴリー: CSS, HTMLの基礎知識, ナレッジノート, 属性 |