html偽選擇子的順序問題

2022-02-06 23:17:04 字數 1069 閱讀 7814

/*link和visited一定要放在active和hover的前面,因為這四個屬性特殊性相同且link和visited包含active和hover狀態,如果放在後面會覆蓋active和hover的共有css屬性(比如此例中,如果將link和visited放在active和hover的後面,link和visited的text-decoration屬性設定會覆蓋active和hover的text-decoration屬性設定,使鏈結下劃線始終不出現)

*/a:hover

a:active

/*此外active一定要放在hover後面,因為hover屬性也包含active屬性且他們特殊性相同,如果hover出現在active後面,hover將覆蓋active的共有css屬性(比如本例中如果a:hover在a:active後面,a:hover的color屬性設定將覆蓋a:active的color屬性設定,將導致滑鼠點選鏈結時還是顯示黑色字型而不是紅色)

*//*

因此官方推薦的設定順序是:link visited hover active

*/style

>

head

>

<

body

>

<

a href

="#"

>

click

a>

body

>

html

>

html 偽類選擇器

1.first child 偽類選擇器,選取其父元素的第乙個子元素的元素 2.last child 偽類選擇器,選取其作為父元素的最後乙個子元素 3.nth child n 偽類選擇器,選其作為父元素的第n個子元素的元素。4.before 偽元素選擇器,所有子元素的最前面新增乙個偽元素。5,afte...

HTML中 結構偽類選擇器的區別

示例 child型別的選擇器,首先選擇的是位置,其次是在看元素,例如.one p nth last child 6 這個選擇器 首先會在父元素 one 下從末尾查詢其倒數第六個元素,然後再判斷這個元素是不是 p 元素,如果是,則為這個元素新增後面的樣式 如果父元素 one 下只有五個子元素 或者 第...

子元素的偽類

1 doctype html 2 html 3 head 4 meta charset utf 8 5 title title 6 style type text css 7 8 first child 可以選中第乙個子元素 9 last child 可以選中最後乙個子元素 10 nth child...