淺談a僞類選擇器的書寫順序

首先先聲明一下標籤a僞類選擇器的正確書寫順序如下

a:link a:visited a:hover a:active


 爲什麼必須得按順序呢?

  這個問題可以這樣來解答。

  首先注意關鍵的兩點:1.這4個僞類特指度相同。2.一個鏈接可能同時處於多種狀態,即同時屬於多個僞類。

  好,現在來詳細剖析。

  未點擊鏈接前,link僞類長期處於激活狀態,鼠標懸停(或點擊)時,<a>鏈接同時處於link和hover(或active)狀態,由於它們特指度相同,在同時激活的情況下,後出現的僞類樣式會覆蓋前面的僞類樣式,故link狀態必須寫在hover(或active)之前。

  再討論hover和active的順序,若把hover放在active後面,當點擊鏈接一瞬,實際你在激活active狀態的同時觸發了hover僞類,hover在後面覆蓋了active的顏色,所以無法看到active的顏色。故hover在active之前

  其次,若把visited放在hover後面,那已訪問過的鏈接一直觸發着visited僞類,會覆蓋hover樣式。

  最後,其實link、visited兩個僞類之間順序無所謂。(因爲它倆不可能同時觸發,即又未訪問同時又已訪問。)

  記這順序有個小招數,“LoVe? HA!”。


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章