CSSのメモ

CSSリファレンス(CSS入門)を読んで学んだ事をメモしておく。

・<span>と<div>の違い
<span>はインライン要素（前後で改行されない）、<div>はブロック要素（前後で改行される）を囲む一般的なタグとして使用される。

・基本
<h1>タグにstyle="color:red;"を指定する。

　h1 { color:red; }

・グルーピング
カンマを用いて各要素の属性を一度に指定。

h1, h2 { color:red; }

・クラス
各タグ名に応じたクラスを定義。

p.red { color:red; }
.bold { font-weight:bold; }　/* タグ名に依存しないクラス名を指定 */ 

クラスは重複して指定可能。

<div class="red bold">赤い太字</div>

・定義済みクラス
a要素やp要素にはいくつかの定義済みクラスを指定することが可能。

a:link { color:green; }
P:first-line { color:red; }    /* 最初の1行 */

・ID属性
クラスの代わりにIDを指定する*1。

#elm123 { color:red; }
h1#elm124 { color:green; }

・状況依存セレクタ
<h1>〜</h1>の中で使用される<em>要素のスタイルを指定。

h1 em { color:red; }

・コメント

h1 { color:red; }    /* Red Color */

・優先順位
タグでstyle="color:blue"と指定するよりも優先度を強くする。

h1 { color:red !important; }

・長さの単位
　em：文字の高さを基準とした1文字分の長さ
　ex：文字xの高さ
　px：ピクセル

*1:クラスとIDの違い
クラスはスタイルの集合につける名前で、複数のタグに同じクラス名を指定することが可能だが、ID はそれぞれの要素につける名前で、ひとつのドキュメント中に複数の要素が同じIDを持つことは許されない。