网页导航栏制作：如何为网页添加导航栏

操作方法

• 01

  制作一个放导航栏的容器制作一个放导航栏的容器，容器名为nav，容器宽为1000px，高为30px，背景颜色为灰色，相关代码如下：#nav{width:1000px;height:30px;background:#CCC;margin:0 auto;margin-top:50px;}<div id="nav"></div>

• 02

  显示结果在浏览器中显示的结果为下图所示：

• 03

  在容器中放入一些导航栏导航栏代码如下:<ul><li>模块一</li><li>模块二</li><li>模块三</li><li>模块四</li><li>模块五</li><li>模块六</li></ul>

• 04

  为导航栏添加一些属性<style type="text/css">#nav{width:1000px;height:30px;background:#CCC;margin:0 auto;margin-top:50px;}navul{width:960px;height:35px;}navul li{float:left;width:100px;float:left;list-style:none;background:yellow;line-height:35px;}</style>

• 05

  导航栏在浏览器页面的显示结果如下图所示：