1

您好我正在尝试制作一个网页。在我使用样式部分的 css 之后，当我给包装器一个背景颜色时，它的工作但是当我去设置子元素的样式时，包装器的底色不起作用，可能是什么原因？请帮我！

body{margin:0px}

.wrapper{width:960px; margin:0 auto; background-color:#ccc;}

 .wrapper > .header{width:960px;}

.wrapper > .header > .logo{width:209px; height:50px; float:left;}

.wrapper > .header > .links{float:right;}
4

2 回答 2

2

原因是你的“包装器”没有高度，因为里面有浮动。要解决此问题，您可以做两件事：

  1. 清除浮动（推荐）
  2. 添加溢出：隐藏到包装器

1) 清除浮动

.floatstop:after {content: ".";display :block;height :0;clear :both;visibility :hidden;}
*:first-child+html .floatstop {min-height: 1px;} /* ie7 fix */
* html .floatstop { height: 1%;} /* ie6 fix */

<div class="wrapper floatstop"> .elements.. </div>

2）溢出技巧

.wrapper {
  width:960px;
  margin:0 auto;
  background-color:#ccc;
  overflow: hidden;
}
于 2013-02-27T09:42:25.593 回答
1

你需要浮动你的包装，以便给它包含在其中的元素的高度，这将显示背景颜色。当您在 Chrome 中检查 .wrapper 时，它给出的尺寸是多少，如果它是 0x0，那么上述修复将起作用。

于 2013-02-27T09:01:42.707 回答