關(guān)于為什么a:nth-child(10)是10，而不是9的問(wèn)題
看好多解答說(shuō)是這里的10是指a標(biāo)簽父元素的第十個(gè)子元素。
但是如果這么理解，我寫(xiě)a:nth-child(10)和寫(xiě)p:nth-child(10)，豈不是一個(gè)意思了？
a標(biāo)簽父元素的第十個(gè)子元素和p標(biāo)簽父元素的第十個(gè)子元素都是同一個(gè)a，但代碼上去明顯不是這樣。
JohannGong
2018-07-23
1 回答
舉報(bào)
0/150
提交
取消
2018-07-23
你理解大致上是對(duì)的，但是這個(gè)元素需要是前面限定的標(biāo)簽。
a:nth-child(10)，指的是其父元素的第10個(gè)元素，如果這個(gè)元素是a，將其選擇中；
p:nth-child(10)，指的是其父元素的第10個(gè)元素（還是那個(gè)a），如果這個(gè)元素是p，將其選中；但此處第十個(gè)元素是a，所以并不能選中；
同理p:first-child 可以選中第一個(gè)p, a:first-child 不能選中元素。
css選擇器中的 :first-child, :last-child, :nth-child; 作用也是一樣。
css選擇器還有:firts-of-type,nth-of-type,last-of-type,nth-last-of-type; 這幾個(gè)選擇器會(huì)先篩選出對(duì)應(yīng)的類(lèi)型，
父標(biāo)簽下第9個(gè)a，可以用 a:nth-of-type(9)將其選中。