强制子 div 使用父样式答案

【问题标题】：Forcing child divs to use parent's style强制子 div 使用父样式
【发布时间】：2011-11-22 23:47:01
【问题描述】：

我想为所有子元素的 div 元素赋予父 div 的背景色。但是，正如我所看到的，即使子 div 没有该属性，子 div 的样式也会覆盖父样式。例如，

<!-- Parent's div -->
<div style="background-color:#ADADAD;">
    some codes here...
    <!-- child's div -->
    <div style="position:absolute;font-size:12px; left:600px;top:100px;">
        again some codes...
    </div>
</div>

在这里，如果我删除子 div 的样式，它工作正常。我认为如果我对外部 css 文件也做同样的事情，我的问题可能会得到解决。但是，我已经完成了数百个这样的 div。那么，是否有强制父样式为子样式，仅用于背景颜色？（css 中的新内容）

【问题讨论】：

“我已经完成了数百个完全一样的 div ......”我很抱歉。
至少，我今天学到了一些东西：)

标签： html css

【解决方案1】：

但是，正如我所见，chid div 的样式会覆盖父级的样式，即使子级没有该属性。

不，它们只是默认不继承该值，因此它们会获得本来应该拥有的任何值（通常是 transparent）。

您可以（理论上）使用背景颜色获得您想要的：inherit。不过有problems in older versions of IE。

【讨论】：

【解决方案2】：

在子 div 上使用继承属性：

background:inherit

<div style="position:absolute;font-size:12px; left:600px;top:100px; background:inherit">

【讨论】：

【解决方案3】：

使用这样的 css 选择器让子 div 的背景从其父级继承：

Parent's div
<div id="thisparticulardiv">
some codes here...
child's div
<div class="childrendiv">
again some codes...
</div></div>

CSS：

#thisparticulardiv {
    background-color:#ADADAD;
    ...
}

#thisparticulardiv div {
    background: inherit;
    position:absolute;
    font-size:12px;
    left:600px;
    top:100px;
}

【讨论】：