0

重複の可能性:
ナビゲーション バーの html css ドロップダウン メニュー

カテゴリが水平に表示される既存のメニューがあります。各カテゴリにカーソルを合わせたときに、リンクの垂直リストをドロップダウンするにはどうすればよいですか? 伝統的なメニューのように動作します。

これが私がこれまでに持っているものです: http://jsfiddle.net/chaddly/GrEWS/3/

<ul id="nav">
    <li><a href="#">Home</a></li>
    <li><a href="#">About</a></li>
    <li><a href="#">Services</a></li>
    <li><a href="#">Products</a></li>
    <li><a href="#">Sitemap</a></li>
    <li><a href="#">Help</a></li>
    <li><a href="#">Contact Us</a></li>
</ul>

</p> 

#nav li a:hover 
{
   background-color:#333333;
   padding-bottom:12px;
   border-bottom:2px;
   border-bottom-color:#f37022;
   border-bottom-style:solid;
   margin:-1px;
}
#nav li a 
{   
   font-family:Arial;
   font-size:12px;
   text-decoration: none;
   float:left;
   padding:10px;
   background-color: #123261;
   color:#ffffff;
   border-bottom:1px;
   border-bottom-color:#000000;
   border-bottom-style:solid;
}
#nav li 
{
    display:inline;
}
#nav
{
    padding:0;
}

ここに例があります

ここに画像の説明を入力

4

1 に答える 1

1

ブートストラップ ドロップダウン メニューを試してみてください。 http://twitter.github.com/bootstrap/javascript.html#dropdowns

于 2012-12-12T04:34:16.050 に答える