我正在嘗試創建第二級下拉菜單。我成功地創建了第一級下拉菜單,但有點卡在使其級別2.請幫助我完成它..使用css創建第二級下拉菜單
也請解釋我什麼錯誤,我正在做,我不能得到第二級下拉即使是CSS部分是好(我這麼認爲)
編輯:我知道有很多關於下拉CSS的教程。但我想知道爲什麼這不起作用。
這裏是鏈接到jsbin
HTML
<ul id="nav">
<li>Home</li>
<li>Details
<ul id="subNav">
<li>x details<li>
<li>y details</li>
</ul></li>
<li>About Us
<ul id="xSubNav">
<li>About company
<ul>
<li>full information</li>
<li>summary</li>
</ul></li>
<li>About Author</li>
</ul></li>
</ul>
CSS
*{font-family:consolas;}
li{line-height:20px;}
ul#nav>li{float:left;width:100px;list-style:none;
cursor:hand;cursor:pointer;}
ul#nav li li
{display:none;width:150px;}
ul#nav li ul
{padding:0;margin:0;}
ul#nav>li:hover>ul>li
{display:block;}
ul#nav>li:hover{color:grey;}
ul li li{color:black;}
ul li li:hover
{color:cornflowerblue;}
ul li li:hover li /* level 2 dropdown part */
{display:block;margin-left:150px;width:300px;}
燁,工作..感謝您的解釋。不管怎麼樣,除去空間在二級下拉的「李」之間? –