nth-child和nth-of-type這兩個(gè)偽類的區(qū)別
例如下題:
理解了這兩個(gè)偽類的區(qū)別之后這個(gè)題就很簡單了
以題中的結(jié)構(gòu)舉例說明:
如果我們要選擇二個(gè)p標(biāo)簽欺殿,那么其選擇器應(yīng)該是 p:nth-child(3){},因?yàn)榈诙€(gè)p標(biāo)點(diǎn)是box里面的第三個(gè)子元素,并且正好是p標(biāo)簽所以能選中,
那如果要選擇h2標(biāo)簽?zāi)兀?/p>
p:nth-child(1)明顯就不行
因?yàn)榈谝粋€(gè)元素是h2標(biāo)簽? 必須寫成h2:nth-child(1){}
E:nth-child(n)? 表示E父元素中的第n個(gè)子元素( 這個(gè)子元素必須是E )
再來看nth-of-type
E:nth-of-type(n)? 表示E父元素中的第n個(gè)E元素
舉例說明,同樣還是選擇第二個(gè)p標(biāo)簽
那么這時(shí)候我們就可以這么寫p:nth-of-type(2){}
這樣就能選中第二個(gè)p標(biāo)簽了
注意? 是第二個(gè)p標(biāo)簽而不是第二個(gè)子元素5瓴琛!劃重點(diǎn)劫恒!