使用CSS的樣式導航欄

我需要使用CSS來設置此導航欄的樣式。這是無序列表。我所擁有的是一些頁面下的另一個頁面，它們就像它們的子頁面一樣。看起來是這樣的：使用CSS的樣式導航欄

<ul id="nav-bar"> 
<li><a href="#">Home</a></li> 
<li><a href="#">Tutorials</a></li> 
<li><a href="#">Menu</a> 
<ul><li><a href="#">Nivo</a></li></ul> 
</li> 
</ul>

主要以爲我不明白的是如何使NIVO（在這種情況下）顯示，只有當用戶將鼠標懸停在菜單列表。這是顯示這樣的子頁面的非常常見的方式，但我不知道如何僅使用CSS來實現此目的。

我主要是後端開發人員，所以我討厭和CSS的東西搞亂，但我別無選擇:(

感謝所有幫助

來源

2012-01-12 user1089548

@ Elen：這是非常可能的，並且只有在CSS中很常見 – Jawad 2012-01-12 16:31:21

絕對不需要JavaScript。如果您需要更多關於css下拉菜單的信息，請閱讀www.cssplay.co.uk/menus/final_drop.html – 2012-01-12 16:31:43

#nav-bar ul{ 
display:none; 
} 
#nav-bar li:hover ul{ 
display:block; 
}

來源

2012-01-12 16:28:16 Treemonkey

真棒;）感謝您的幫助，我會在幾分鐘內接受它最好的答案 – user1089548 2012-01-12 16:33:16

http://jsfiddle.net/MsAta/

但它不會在每個瀏覽器中工作

最好是使用javascript - 有很多像這樣的菜單jQuery插件

來源

2012-01-12 16:30:49 giker

使用CSS的樣式導航欄

回答

相關問題