css菜單子菜單水平

Question

如何創建像這樣的CSS菜單和子菜單。

當我點擊或移動鼠標移到菜單，它在底部

Answer 1

HTML

<ul class="nav"> 
    <li><a href=#><span>Main item text</span><span class="bullet"></span></a> 
     <ul> 
     <li><a href=#><span>Sub item text</span><span class="bullet"></span></a></li> 
     </ul> 
    </li> 
</ul> 

CSS

ul.nav li ul { position: absolute; display: none; } 
ul.nav li { float: left; } 
ul.nav li:hover ul { display: block; } 

Ofcourse，除了一個小圖標你必須正確地列出樣式。 在這裏，你可以嘗試它如何使用子彈http://jsfiddle.net/9r4Lf/1/