CSS2 の多くの属性で、親のスタイルを継承することを意味する inherit という値がサポートされました。CSS3 ではすべての属性で利用可能となりました。通常では継承されないスタイルを親要素から継承させたり、継承することを明示的に示したい場合に使用されます。
| CSS | IE/Edge | Firefox | Chrome | Opera | Safari |
|---|---|---|---|---|---|
| CSS2 | 8 | 1.0 | 1.0 | 4.0 | 1.0 |
margin, padding, border, background などは、普段は子要素に継承されませんが、inherit を指定することで、子要素(classB)でも margin, padding, border, background が適用されます。
.classA {
margin: 10px;
padding: 10px;
border: 1px solid #999;
background: #cfc;
}
.classB {
margin: inherit;
padding: inherit;
border: inherit;
background: inherit;
}
<div class="classA"> <div class="classB"> サンプル </div> </div>