一般浏览网页时导航条一般都是固定在顶部的，但是使用position:fixed属性时，接下去网页中的内容就会从屏幕最顶部开始布局，这就不合常理了，那么如何解决这个问题呢？
1.网页界面内容
<body>
<div class=" driveProcedurebar">
<img src="../img/driveProcedurebar.png" class="img-responsive">//img-responsive是bootstrap里面定义的css样式，如需使用可以引入bootstrap的css样式
</div>
<div class="driveProcedure">
<img src="../img/driveProcedure.png" class="img-responsive">
</div>
</body>
2.样式
.driveProcedure{
position:absolute;//绝对布局，从父容器的最左点开始
top:6%;//设置距离，用百分比才能自适应不同的设备
}
.driveProcedurebar{
position:fixed;//将第一个div的内容固定在顶部
z-index:2;//设置第二层的div在下面，这样图片往上移动的时候才不会盖住顶部导航栏
}
如果觉得《网页导航条布局》对你有帮助，请点赞、收藏，并留下你的观点哦！
