我的第一个DIV+CSS导航条 仿PHP168

HTML代码

<div>
<ul>
<li><a href="index.html" target="_blank">首页</a></li>
<li><a href="products.html" target="_blank">产品中心</a></li>
<li><a href="bbs.html" target="_blank">论坛</a></li>
<li><a href="contact.html" target="_blank">联系我们</a></li>
<li><a href="about.html" target="_blank">关于我们</a></li>
</ul>
</div>

 

CSS代码

 

div {
    background:url(http://www.php168.com/images/htm/home_22.gif);
    width:auto;
    height:42px;
}
div ul {
        margin:0;
        float:right;
        width:980px;
        display:block;
        }
div ul li {
        list-style:none;
        font-size:14px;
        color:#FFFFFF;
        line-height:42px;
        float:left;
        background:url(http://www.php168.com/images/htm/home_25.gif) no-repeat left;
        padding-right:14px;
        padding-left: 14px;
         }
div ul li a:link {
    text-decoration:none;
    color:#FFF;
}
div ul li a:hover {
    text-decoration:underline;
    color:#FFF;
}
div ul li a:focus{
    text-decoration:none;
    border:#FFF dashed 0.2px;
}

div ul li a:visited{
    text-decoration:none;
    border:#FFF dashed 0.05px;
}