你的位置:首页 > 网页设计

[网页设计]导航菜单的一般做法

<!DOCTYPE html><html><head><title>导航栏的做法之一</title><style>/*这是导航条****************************************************************************/  /*容器是用来装那个存放了a标签的div*/  .rongqi{    background:#2C323B;    height:55px;    width:100%;    margin:80px 0px;  }  /*导航条里面各个a标签的总宽度,当前是六个a的宽度,每个a宽度默认是200px*/  #top{    //border:solid #fff 1px;    margin:0px auto;    width:1200px;    height:55px;      }  /*hanghang是a标签的class*/  .hanghang{    font-size:20px;    color:#DDDDDD;    text-align:center;    line-height:50px;    float:left;    width:200px;    height:55px;    margin-left:0px;    list-style-type:none;    background:#2C323B;    text-decoration:none;  }  .hanghang:hover{    list-style-type:none;    color:#ffffff;    font-weight:800;    background:#0C8ED9;  }/*****************************************************************************这是导航条/  </style></head><body><!--这是导航条***************************************************************************-->  <div >    <div id="top">      <a href="#">首页</a>      <a href="#">导航1</a>      <a href="#">导航2</a>      <a href="#">导航3</a>      <a href="#">导航4</a>      <a href="#">导航5</a>    </div>  </div><!--***************************************************************************这是导航条--></body></html>