0

我认为这是相当简单的事情，所以我将粘贴代码。

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style>
        *{
            margin:0;
            padding:0;
        }

        .c1 {
            background: yellow;
            width: 800px;
        }

        .c2 {
            background: blue;
            margin: 50px;
        }
    </style>
</head>
<body>

<div class="c1">
    <div class="c2">  
        1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>1<br>
    </div>
</div>

</body>
</html>

问题是，为什么页面顶部或底部没有黄色条？我认为它应该在 c1 的受控空间中，但背景颜色是不可见的。

4

2 回答 2

0

因为利润率下降。添加overflow:auto到您的 c1 规则：

 .c1 {
     background: yellow;
     width: 800px;
     overflow:auto;
 }

jsFiddle 示例

于 2013-07-20T14:32:08.307 回答
0

这是保证金崩溃问题。在此实例中为 c1 添加填充以获得所需的效果。我已经回答了有关保证金崩溃的更复杂的问题，但这不需要这些措施。

于 2013-07-20T14:35:00.643 回答