|
|
主要是利用了a:hover[ie]，li:hover[非ie]的狀態(tài)來做出顯示/隱藏菜單的效果。
關(guān)鍵之處：
程序代碼
<!--[if IE 7]><!--></a><!--<![endif]-->
這一段注釋表示：只有非IE瀏覽器和IE7才能讀取到 </a>
這樣在非IE瀏覽器及IE7版本的瀏覽器中讀取到的html是：
程序代碼
<li><a href="#">導(dǎo)航</a>
<ul><li>二級導(dǎo)航</li></ul>
</li>
程序代碼
<!--[if lte IE 6]></a><![endif]-->
這一段注釋代表：只有IE6以及IE6以下版本的瀏覽器才能讀取到 </a>
而在IE6以及IE6以下版本的瀏覽器中讀取到的html就是：
程序代碼
<li><a href="#">導(dǎo)航
<ul><li>二級導(dǎo)航</li></ul>
</a>
</li>
有些朋友可能要問：為什么要搞的那么復(fù)雜，而不都用鏈接來包含二級列表呢，那樣就只用寫a:hover就可以了，代碼簡單多了。
我個人覺得：
玩標(biāo)準(zhǔn)就要盡可能的去遵循語義。
在IE6以及以下版本中由于不支持a以外標(biāo)記的hover偽類，所以目前來說只有這個辦法能達(dá)到類似的目的，對著IE6...只好放棄語義了。
但我們可不要為了一個IE6而壞了整鍋湯哦，所以有些事情雖然麻煩了點，但還是要做的~
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執(zhí)行]
注意里面是分段的，[ 隨意發(fā)揮 ] 。俺先來發(fā)揮一下~ （原先沒注意兼容，現(xiàn)在兼容了...）
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執(zhí)行]
HTML/CSS技術(shù)：css寫菜單：簡潔注釋版，轉(zhuǎn)載需保留來源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請第一時間聯(lián)系我們修改或刪除，多謝。
