导航

 <div class="d2">
        <ul class="nav">
            <li><a href="#">首页</a></li>
            <li><a href="zuozheng.html" target="_blank">资料</a></li>
            <li><a href="xiangmu.html" target="_blank">项目</a></li>
           <li><a href="xiazai.html" target="_blank">工具</a></li>
                 </ul>
    </div>

样式

/*导航*/
.nav{
    width:1000px;
     
   list-style:none;
    margin-left:150px;
}
    .nav li {
        float: left;
        width: 99px;
        height: 40px;
        position: relative;
    }
 .nav li a{
    display:inline-block;
    background-color:#1552ab;
   height: 40px;
    width:100px;
    text-align:center;
    color:#fff;
    font-size:16px;
    font-weight:bold;
    vertical-align:middle;
    line-height:40px;
    text-decoration:none;

}
.nav li a:hover{  display:inline-block;
    background-color:black;
    cursor:pointer;//鼠标点击时
}