UL布局导航，最后一个外边框怎么去掉

iammonster

浏览: 1791577 次
性别:
来自: 北京

最近访客更多访客>>

yuanyuan7891

sagadan

JianCaesar

led19880901

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

ul布局导航

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
#menus
{
margin:auto;
width:900px;
height:38px;
background-color:#1F6193;
background-image: url(imgs/index.jpg);
}
#menus ul
{
height:30px;
text-align:center;
padding-top:8px;
padding-bottom:0px;
}
#menus ul first-child
{
border-right:0px dashed white;
}
#menus ul li
{
list-style-type:none;
display:inline;
padding-left:20px;
padding-right:20px;
border-right:1px dashed white;
}
#menus ul li a
{
font-size:16px;
font-variant:normal;
color:white;
}

#menus ul li a:link{
text-decoration:none;
}
#menus ul li a:active{
color:#F13C01;
text-decoration:underline;
}
#menus ul li a:visited{
text-decoration:none;

}
#menus ul li a:hover{
color:#F13C01;
text-decoration:underline;
cursor:pointer;
background-color:#3671A5;
}


</style>
<title>无标题文档</title>
</head>

<body>

<div id="menus">
    <ul>
        <li><a href="#">首页</a></li>
        <li><a href="#">标签A</a></li>
        <li><a href="#">标签BB</a></li>
        <li><a href="#">标签BGT</a></li>
        <li><a href="#">标签BB</a></li>
        <li><a href="#">标签BB</a></li>
        
        <li style="border-right-width:0px;"><a href="#">标CCC签</a></li>
    </ul>
</div>

</body>
</html>

HTML效果是：

代码里面，我写了内联样式，很不好，如果用class,有没有ID级别高，最后一个外边框去掉有啥好方法呢？