CSS:inheritance
出典: MDC
« CSS « CSS リファレンス
目次 |
[編集] 概要
すべての CSS プロパティの定義の概要には、プロパティがデフォルトで継承されている ("継承: する") か、継承されていない ("継承: しない") かが書かれています。これは、要素上のプロパティに値が設定されていない時の値をコントロールします。
[編集] 継承されたプロパティ
値を持たない継承されたプロパティが要素上に指定された場合、要素は、その親要素上のプロパティの計算値を取得します。 ドキュメントのルート要素だけは、プロパティの概要で与えられた初期値を取得します。
一般的な継承されたプロパティの例は color プロパティです。スタイル規則を与えて:
p { color: green }
このようにマークアップします:
<p>この段落には<em>強調されたテキスト</em>があります。</p>
"強調されたテキスト" は、em 要素が p 要素から color プロパティの値を継承したため、緑色になります。これはプロパティの初期値を取得しません。(ページに色が指定されていない場合、プロパティはルート要素に使用された色になります。)
[編集] 非継承のプロパティ
値を持たない非継承のプロパティ (Mozilla コード内ではリセットプロパティとも呼ばれます) が要素上に指定された場合、要素はプロパティの初期値を取得します。(プロパティの概要で指定されています。)
非継承のプロパティの一般的な例は border プロパティです。スタイル規則を与えて:
p { border: medium solid }
このようにマークアップします:
<p>この段落には<em>強調されたテキスト</em>があります。</p>
"強調されたテキスト" は (border-style の初期値が none であるため) 境界線を持ちません。
[編集] 注記
inherit キーワードは著者にはっきりと継承を指定させます。これは継承されたプロパティでも非継承のプロパティでも動作します。