代碼
?color : ?#000000 ;
?TEXT-DECORATION : ?none
}
A:visited? {
?COLOR : ?#000000 ;
?TEXT-DECORATION : ?none
}
A:hover? {
?COLOR : ?#ff7f24 ;
?text-decoration : ?underline ;
}
A:active? {
?COLOR : ?#ff7f24 ; ??
?text-decoration : ?underline ;
}
?
我想，原因就在于瀏覽器解釋CSS時(shí)遵循的“就近原則”。
舉例來說：
我想讓未訪問鏈接顏色為藍(lán)色，活動(dòng)鏈接為綠色，已訪問鏈接為紅色：
- 第一種情況：我定義的順序是a:visited、a:hover、a:link，這時(shí)會(huì)發(fā)現(xiàn)：把鼠標(biāo)放到未訪問過的藍(lán)色鏈接上時(shí)，它并不變成綠色，只有放在已訪問的紅色鏈接上，鏈接才會(huì)變綠。
- 第二種情況：我把CSS定義順序調(diào)整為：a:link、a:visited、a:hover，這時(shí)，無論你鼠標(biāo)經(jīng)過的鏈接有沒有被訪問過，它都會(huì)變成綠色啦。
這是因?yàn)椋? 一個(gè)鼠標(biāo)經(jīng)過的未訪問鏈接同時(shí)擁有a:link、a:hover兩種屬性 ，在第一種情況下，a:link離它最近，所以它優(yōu)先滿足a:link，而放棄a:hover的重復(fù)定義。
在第二種情況，無論鏈接有沒有被訪問過，它首先要檢查是否符合a:hover的標(biāo)準(zhǔn)（即是否有鼠標(biāo)經(jīng)過它），滿足，則變成綠色，不滿足，則繼續(xù)向上查找，一直找到滿足條件的定義為止。
一句話： 在CSS中，如果對(duì)于相同元素有針對(duì)不同條件的定義，宜將最一般的條件放在最上面，并依次向下，保證最下面的是最特殊的條件 。
這樣，瀏覽器在顯示元素時(shí)，才會(huì)從特殊到一般、逐級(jí)向上驗(yàn)證條件，才會(huì)使你的每一個(gè)CSS語句都起到效果。
當(dāng)然，如果故意打亂順序，也會(huì)造成一些特殊的效果。比如，可以為鏈接制造出下劃線顏色與文字顏色的差異。
近日突然發(fā)現(xiàn)，原來這個(gè)CSS問題早已有高人提出啦。還是個(gè)老外呢。他給總結(jié)了一個(gè)便于記憶的“ 愛恨原則 ”（ L o V e/ H A te），即四種偽類的首字母:LVHA。
再重復(fù)一遍正確的順序： a:link、a:visited、 a:hover 、a:active ?.
最后經(jīng)驗(yàn)補(bǔ)充：
1.鼠標(biāo)經(jīng)過的“未訪問鏈接”同時(shí)擁有 a:link、a:hover 兩種屬性，后面的屬性會(huì)覆蓋前面的屬性定義；
2.鼠標(biāo)經(jīng)過的“已訪問鏈接”同時(shí)擁有 a:visited、a:hover 兩種屬性，后面的屬性會(huì)覆蓋前面的屬性 定義 ；
?
所以說，a:hover定義一定要放在a:link、a:visited的后面，，，
更多文章、技術(shù)交流、商務(wù)合作、聯(lián)系博主
微信掃碼或搜索：z360901061
微信掃一掃加我為好友
QQ號(hào)聯(lián)系： 360901061
您的支持是博主寫作最大的動(dòng)力，如果您喜歡我的文章，感覺我的文章對(duì)您有幫助，請(qǐng)用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧，狠狠點(diǎn)擊下面給點(diǎn)支持吧，站長非常感激您！手機(jī)微信長按不能支付解決辦法：請(qǐng)將微信支付二維碼保存到相冊(cè)，切換到微信，然后點(diǎn)擊微信右上角掃一掃功能，選擇支付二維碼完成支付。
【本文對(duì)您有幫助就好】元
