Question

我有一个方框center，我想根据页面的不同对该方框进行着色。我试试这个

#center {
    margin-top: 2px;
    padding: 10px 20px;    /* CC padding */
    width: 100%;
    height: 800px;
    color: black;
    font-size: 11px;        
}
#backgroundRed{
    background-color: red;
}
#container {
    padding-left: 200px;   /* LC fullwidth */
    padding-right: 240px;  /* RC fullwidth + CC padding */
}
#container .column {
    position: relative;
    float: left;
}

所以我会尝试这个

    <div id="containder">
        <div id="backgroundRed">
            <div id="center" class="column">
            abc   
            </div>
        </div>
    </div>

然而盒子的背景并没有变成红色，有人向我解释我做错了什么？顺便说一句，我必须class="column"

Answer 1

也许你想要的是这条规则？

#backgroundRed div#center {
    background-color: red;
}

这意味着“如果div＃center是#backgroundRed的孩子......”

您的示例应该使外部div具有红色背景。

Answer 2

尝试以下代码

#backgroundRed{
background-color:red;
overflow:hidden;
}

关于嵌套CSS的问题？

2 个答案: