造型與部分分壓器和onHover選項風格

Question

嗨，我想提出一個菜單CSS菜單，

其內置了UL和LIS

請你能告訴我我如何能每個L1後做線並用該特定的子彈圖像進行縮進。

這裏，如果你想看到的代碼我使用的菜單：http://www.dnn-menu.com/superfish/Home.aspx

這裏是設計的圖像：

Answer 1

嗨ü可以讓這個導航在純CSS

例子是

HTML

<ul class="navi"> 
<li><a href="">Lorem text here</a></li> 
<li><a href="">Lorem text here</a></li> 
<li><a href="">Lorem text here</a></li> 
<li><a href="">Lorem text here</a></li> 
<li><a href="">Lorem text here</a></li> 
<li><a href="">Lorem text here</a></li> 
</ul>​ 

的CSS

ul.navi{ 
    margin:10px 0 0 10px; 
    width:300px; 
} 

ul.navi li{ 
    background:#1f1f1f; 
    display:block; 
    position:relative; 
} 
ul.navi li:after{ 
    position:absolute; 
    content:""; 
    left:0; 
    right:0; 
    bottom:0; 
    border-bottom:solid 1px #2a2a2a; 
    border-top:solid 1px #171717; 
} 
ul.navi li:last-child:after{ 
    position:absolute; 
    content:""; 
    left:0; 
    right:0; 
    bottom:0; 
    border:0; 
} 

ul.navi li a{ 
    display:inline-block; 
    font-size:14px; 
    color:#989898; 
    line-height:45px; 
    text-decoration:none; 
    margin-left:20px; 
} 
ul.navi li a:hover{ 
    color:#fff; 
}​ 

現在現場演示click here http://jsfiddle.net/rohitazad/8abUy/4/