我有一个100%宽度的标题,和一个980px的导航内部标题
现在我想给出的位置为固定的头部和导航。我已经尝试了以下代码,但不能得到我想要的请帮助我,
我的header.css
width:100%;
height:60px;
background: #ffffff;
position:fixed;
z-index:999;`还有我的nav.css
background: #ffffff;
height: 60px;
text-align:center;
position:fixed;
z-index:99; .nav ul
margin:0;
padding:0;.nav li
display: inline-block;
list-style-type: none;
vertical-align:middle;`.nav li a
font-size: 16px;
color: black;
display: block;
line-height: 60px;
padding: 0 10px;
text-decoration: none;发布于 2013-11-11 23:45:22
如果nav在报头中,那么在nav.css中不需要索引,还应该删除z索引。更清楚地描述问题和您正在使用的html将会有所帮助,如果这没有帮助的话。
发布于 2013-11-12 00:07:36
@Fastnto,这是你想要的东西吗?
http://jsfiddle.net/alexandrecanijo/NBp8F/
为了显示标题(#ccccccc)和导航(#000000),我更改了原始CSS的一些部分,并添加了具有足够lorem ipsum的.content,以便您能够看到导航。但是,CSS可能会在某些部分被清理和重构……没有改变来做这件事...
希望这能有所帮助。
html,body, p {
margin: 0;
padding: 0;
border: 0;
font: 14px arial;
}
.header {
width: 100%;
height: 80px;
background: #cccccc;
position: fixed;
z-index:999;
margin: 0;
clear: both;
top: 0;
}
.nav {
background: #000000;
height: 60px;
text-align:center;
z-index:99;
}
.nav ul {
margin:0;
padding:0;
}
.nav li {
float: left;
list-style-type: none;
}
.nav li a {
font-size: 16px;
color: #fe6700;
display: block;
line-height: 60px;
padding: 0 10px;
text-decoration: none;
}
.nav li a:hover {
color: #000000;
background: #fe6700;
}
.content {
margin-top: 80px;
}https://stackoverflow.com/questions/19910029
复制相似问题