HTML：你如何讓水平導航欄有下拉菜單？

我對HTML/CSS編碼相當陌生，但我目前正在學習和開發一個網站。但是，我有點卡在我的導航欄的過程中。我設法讓一個導航欄工作，一個水平的工作背景圖像。我遇到的一個問題是導航欄有下拉菜單，如下所示：http://maxcdn.webappers.com/img/2008/10/free-css-drop-down-menu.png。除了沒有額外的子菜單。這是我到目前爲止有：HTML：你如何讓水平導航欄有下拉菜單？

HTML：

<div id="menu"> 
<ul> 
<li><a href="">home</a></li> 
<li><a href="">blank</a></li> 
<li><a href="">about</a></li> 
<li><a href="">site</a></li> 
<li><a href="">contact</a></li> 
</ul> 
</div> 
<div style="z-index:0;left:0;top:0;width:100%;height:100%"> 
<img src="unknown.jpg" style='width:100%;height:100%'/> 
</div>

CSS：

如果

#menu { 
    width: auto; 
    height: auto; 
    font-size: 16px; 
    font-family: Tahoma, Geneva, sans-serif; 
    font-weight: bold; 
    text-align: center; 
    text-shadow: 3px 2px 3px #333333; 
    background-color: #8AD9FF; 
    border-radius: 8px; 
} 
#menu ul { 
    height: auto; 
    padding: 8px 0px; 
    margin: 0px; 
    display: inline; 
} 
#menu li { 
display: inline; 
padding: 20px; 
} 
#menu a { 
    text-decoration: none; 
    color: #00F; 
    padding: 8px 8px 8px 8px; 
} 
#menu a:hover { 
    color: #F90; 
    background-color: #FFF; 
}

對不起，問題是比較容易回答，但我有麻煩了。我不確定如何將HTML代碼更改爲訪問者可以將鼠標懸停在其上的代碼，例如聯繫人，他們可以選擇管理員或其他人。謝謝。

來源

2013-11-22 user3016643

請檢查此鏈接（http://getbootstrap.com/components/#navbar-default）。 –

您需要定義相關元素的onmouseover事件，然後使用一些Javascript將新元素附加到菜單div的某處（或觸發其可見性）。對於初學者來說，這不是最簡單的事情！

來源

2013-11-22 04:39:00 user3020233

HTML：你如何讓水平導航欄有下拉菜單？

回答

相關問題