如何解决除非添加溢出：隐藏，否则CSS背景颜色不会显示为什么？
| 我正在使用CSS布局，但是我不理解为什么除非在CSS上添加“ 0”，否则导航栏的背景颜色才会显示出来。有人可以告诉我怎么回事吗？谢谢 ：） 我的CSS文件：@import \"reset.css\"; /* Meyer\'s CSS reset */
body { background-color: #f3f3f3; font: 15px sans-serif; }
#wrapper {
width: 1000px;
margin: 0 auto;
}
#navigation {
width: inherit;
margin-top: 20px;
background-color: #ccc;
overflow: hidden;
}
#navigation li {
float: left;
}
#navigation li a {
display: block;
padding: 10px 10px;
text-decoration: none;
color: #000;
}
#navigation li a:hover {
background-color: #aaa;
}
<!DOCTYPE html>
<html>
<head>
<title>Layout</title>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" />
<link rel=\"stylesheet\" type=\"text/css\" href=\"css/styles.css\" />
</head>
<body>
<div id=\"wrapper\">
<div id=\"navigation\">
<ul>
<li><a href=\"\">Nav0</a></li>
<li><a href=\"\">Nav1</a></li>
<li><a href=\"\">Nav2</a></li>
<li><a href=\"\">Nav3</a></li>
<li><a href=\"\">Nav4</a></li>
<li><a href=\"\">Nav5</a></li>
</ul>
</div>
<div id=\"header\">
</div>
<div id=\"content\">
</div>
<div id=\"footer\">
</div>
</div>
</body>
</html>
解决方法
“ 0”使容器建立新的格式化上下文，以在其中包含浮点数。没有它，浮动元素将形成其自己的格式设置上下文，并在正常流程之外独立于容器显示。
, 您应该使用明确的修订类（在
<ul>
<ul>
.clearfix {
zoom:1;
}
.clearfix:after {
content: \".\";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}