我正在使用骨架框架并尝试制作一个简单的中殿酒吧？
当我尝试创建一个导航栏 div 并将 CSS 导航栏 ID 颜色设置为蓝色时，背景不会改变。但是，如果我尝试更改各个列，颜色将会改变。有没有一种方法可以让网格框架在顶部创建一个一致的导航栏，而不用告诉每一列是某种颜色。这看起来很傻。 还有可能有一个导航栏超过框架 960px 的长度吗？我想让条形背景延伸到屏幕的两侧。
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="skeleton.css">
<link rel="stylesheet" type="text/css" href="normalize.css">
</head>
<div class="container">
<div id="nav-bar">
<div class="two columns">
<h1>DS</h1>
</div>
<div id="nav" class="ten columns">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
</div><!---nav-bar--->
</div><!---container--->
</html>
CSS:
.container {
margin-top: 50px;
}
#nav-bar {
background-color: blue;
}
#nav {
margin: 13px 0 0 0;
}
#nav ul li {
display: inline;
margin: 0 20px 0 0;
margin-bottom: 130px;
}
#nav a {
text-decoration: none;
color: black
}
#nav a:hover {
text-decoration: underline;
}
最佳答案
#nav children 向左漂浮，使#nav没有高度。
让我们追加 <div style="clear:both"></div>在 #nav 的结束标记之前使其具有像这个 fiddle 一样的高度。
关于html - 为什么我的背景导航栏不会改变颜色？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31895629/