1 
<html>
<head>  
    <style>
        #wrap{
            width: 800px;
            background-color: black;
            color: red;
        }



        #right{
            float: right;
        }
    </style>
</head>
<body>
    <div id="wrap">
        <div id="right">
            <h1>RIGHT</h1>
        </div>
    </div>
</body>

因为在这个例子中，只有文本颜色被继承，而不是背景颜色。有人可以解释我为什么吗？

4

2 回答 2

3

如果未设置，该color属性在CSS 标准中定义为从父级继承（请注意“继承：是”部分）。该background-color属性不是（默认为transparent，并且具有“继承：否”）。不过，您总是可以这样做：

#right
{
    float: right;
    background-color: inherit;
}

当您设置background-color为 时inherit，它会执行此操作。

于 2012-07-06T16:23:57.037 回答
0

您可以添加overflow:auto;到 #wrap 来完成此操作：

#wrap{
    width: 800px;
    background-color: black;
    color: red;
    overflow:auto;
}

jsFiddle 示例

于 2012-07-06T16:23:05.850 回答