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>