竖线间隔导航

CSS

<style type="text/css" title="default" media="screen">
.nav  {
    width : 408px ; /*  这个宽度一定要按li中的宽度算好  */
    float : right ;
    display : inline ;
    overflow : hidden ;
}
.nav ul  {
    margin : 0 ;
    padding : 0 ;
    font-size : 12px ;
    
    list-style-type : none ;
}
.nav li  {
    float : right ;
    height : auto ;
    text-align : center ;
    padding : 0 10px ;
    border-right : 1px solid #444 ;
    margin-right : -1px ;
}
.nav li a {  display : block ; text-decoration : none ; }
.nav li a {  display : inline ; }
.nav li a:hover  {  color :  #ff0 ;  background-color :  #f00 ; }    

</style>  

 HTML:

< div  class ="nav" >
   < ul >
     < li >< a  href ="show.htm" > 产品展示 </ a ></ li >
     < li >< a  href ="case.htm" > 成功案例 </ a ></ li >
     < li >< a  href ="service.htm" > 客户服务 </ a ></ li >
     < li >< a  href ="download.htm" > 下载中心 </ a ></ li >
   </ ul >

</div>