這是乙個相當炫的功能，讓網頁看起來像桌面程式，如window的開始選單。實現原理基本和純css相簿差不多，但要注意的事項比較多，讓我們一步步來吧。
先來乙個非常簡單的一級選單與懸停效果。
*
.menu
.menu li
.menu a
.menu a:hover
.menu li span
.menu a:hover span
執行**
這裡有兩個值得注意的地方。我們先說第乙個。子選單(span元素)的top應該能使其頂部停留在a元素的範圍內，如果包含塊是li元素，同理。當span的top值大於32px，如40px，我們就無法把滑鼠移到span元素上。因為離開了a:hover的作用範圍，span元素又重新隱藏。
.menu li span執行**
第二個問題是ie6特有的，就是子選單在對應的包含塊mouseout後仍不消失的問題。hover偽類相當於moverover與moverout。我們在可以在mouseover給它的子孫元素認定一種樣式，mouseout時認定另一種。換言之，display現在在ie6無法切換（img元素除外）。解決方法用visibility 代替display。
純css相簿 by 司徒正美
執行**
好了，現在我們真正做二級選單，把有關span的css全刪掉，並在結構層原span的位置改為如下**：
選單二
選單三
選單四
執行**
我們在各遊覽器看一下，感覺非常乏力。ie6與opera10的二級選單項是垂直的，但我們並沒有清除浮動啊？firefox3.5與chrome與safari4的二級選單項是水平分布了，但上面好像多出乙個選單項……ie8同學這次反而是表現得最好的。我沒有裝ie7，所以一向忽略它。
我們重新設定一下樣式，如把包含塊改設在li元素上，讓二級選單項呈垂直顯示。
*
.menu
.menu li
.menu a
.menu a:hover
/*新增的二級選單部分*/
.menu ul ul
.menu ul a:hover ul
.menu ul ul li
選單二
選單三
選單四
執行**
發現二級選單在firefox與safari與chrome中沒有反應，彈不出來（這三個瀏覽器的css部分互相抄襲嚴重啊）。opera10表現得最好，ie8其次。不過，標準瀏覽器的所有元素都支援hover偽類，不像ie6，非帶href的a元素不可。我們改寫部分css**：
.menu ul li:hover ul,/*非ie6*/
.menu ul a:hover ul
選單二
選單三
選單四
執行**
選單二//***************略************
//***************略************
選單二選單三
選單四
執行**
好了，搞定非ie6的所有遊覽器了，下一部分我們來處理ie6這個固執的孩子。
純CSS多級選單2
這部分最後給出的成品效果比較驚人，也就是傳說中的純css六級選單。這個東西最厲害的地方是相容所有主流瀏覽器 ie6，ie8，maxthon2.5，firefox3.5，opera10，safari4與chrome2 而一點css hack也沒有用。畢竟css hack只是權宜之計，治標不治本，誰知它...
純CSS多級選單2
這部分最後給出的成品效果比較驚人，也就是傳說中的純css六級選單。這個東西最厲害的地方是相容所有主流瀏覽器 ie6，ie8，maxthon2.5，firefox3.5，opera10，safari4與chrome2 而一點css hack也沒有用。畢竟css hack只是權宜之計，治標不治本，誰知它...
python 多級選單 python多級選單
該樓層疑似違規已被系統摺疊 隱藏此樓檢視此樓 dic china 直轄市 北京市 東城區 西城區 崇文區 宣武區 朝陽區 海淀區 豐台區 石景山區 門頭溝區 房山區 通州區 順義區 昌平區 大興區 懷柔區 平谷區 延慶縣 密雲縣 省 浙江省 杭州市 拱墅區 上城區 下城區 江乾區 西湖區 濱江區 蕭...