CSS

Cascading Style Sheets inherit keyword.

inherit

 inherit は CSSのキーワードで、要素のプロパティの計算値を親要素から取得するよう指定します。 CSSの一括指定 all を含め、すべての CSSプロパティに適用することができます。通常では継承されないスタイルを親要素から継承させたり、継承することを明示的に示したい場合に使用されます。

 継承プロパティにおいては、既定の動作を推進するものであり、他の規則を上書きする場合にのみ必要です。非継承プロパティにおいては、比較的意味の弱い動作をしますので、allプロパティには initial, unsetなどを使用した方が良いかもしれません。

 親要素が包含ブロックではなかった場合であっても、常に文書ツリー内の親要素から継承が行われます。

Example of use

 margin, padding, border, background などは、普段は子要素に継承されませんが、inherit を指定することで、子要素(classB)でも margin, padding, border, background が適用されます。

Before setting inherit

サンプル

HTML source


<div class="classA">
	<div>
		サンプル
	</div>
</div>

CSS source


.classA {
	margin: 10px;
	padding: 10px;
	border: 3px solid #999999;
	background: #66bb66;
}

After setting inherit

サンプル

HTML source


<div class="classA">
	<div class="classB">
		サンプル
	</div>
</div>

CSS source


.classA {
	margin: 10px;
	padding: 10px;
	border: 3px solid #999999;
	background: #66bb66;
}
.classB {
	margin: inherit;
	padding: inherit;
	border: inherit;
	background: inherit;
}