2011/12/26 at 13:52 » Comments (449)

以下代碼在ie6以上版本以及其他標(biāo)準(zhǔn)瀏覽器下，都可以實(shí)現(xiàn)純css的下拉菜單效果，原理是通過(guò)li:hover控制菜單的顯示隱藏。 <ul id="nav"> <li><a href="#">這是顯示的標(biāo)題1</a> <ul> <li><a href="#">這是列表中的內(nèi)容1</a></li> <li><a href="#">這是列表中的內(nèi)容2</a></li> <li><a href="#">這是列表中的內(nèi)容3</a></li> <li><a href="#">這是列表中的內(nèi)容4</a></li> </ul> </li> <li><a href="#">這是顯示的標(biāo)題2</a> <ul> <li><a href="#">這是列表中的內(nèi)容5</a></li> <li><a href="#">這是列表中的內(nèi)容6</a></li> <li><a href="#">這是列表中的內(nèi)容7</a></li> <li><a href="#">這是列表中的內(nèi)容8</a></li> </ul> </li> </ul> CSS樣式代碼 #nav, #nav ul{ /* all lists */ padding: 0; margin: 0; list-style: ...more »