Subject   : スタイルの継承

カテゴリー  : Home page > スタイルシート


 スタイルの継承
CSSのプロパティーとその値は親要素から子要素に継承されます。 例えば、文字の色など前景色を表す'color'プロパティをbody要素(セレクタ)に 指定すると、
BODY {color:#00c }
BODY要素の子要素は全て前景色が #00c 、つまり青い文字で表示されます。 親要素の値を子要素が継承しているわけです。
また、子要素のプロパティの値を算出するに当り、親要素の値を基にする場合も 有ります。
BODY {font-size: 20px }
H1 {font-size: 1.2em }
P {font-size: 0.8em }
上の例では、BODY要素のフォントの大きさを 20px で指定しています。 BODY要素内のH1要素のフォントの大きさは 1.4em = 1.4×20px = 28px になります。 BODY要素内のP要素のフォントの大きさは 0.8em = 0.8×20px = 16px になります。 注)'font-size' を絶対単位で指定すると、ブラウザで標準フォントの 大きさが変更できなくなります。文書閲覧者の便宜を考えるなら、 'font-size' の値に絶対単位指定は避けた方が良いでしょう。

子要素では、親要素と異なる部分だけ定義すれば良いですが、継承しないプロパティー もあります。例えば、 'background-color' や 'line-height' 、 'font-size' などは 継承しますが、 'margin-top'などは継承しません。
   ⇒ スタイルシートの記述ルール

[メニューへ戻る]  [HOMEへ戻る]  [前のページに戻る]