css nth-child n是啥意思

Posted 2023-03-15

当前元素的父元素的第n个子元素 参考技术A nth-child(n)
例 p:nth-child(2)
选择属于其父元素的第二个子元素的每个<p>元素。

nth-of-type(n)
例 p:nth-of-type(2)
选择属于其父元素第二个<p>元素的每个<p>元素。本回答被提问者采纳 参考技术B n是第几个的意思，值可以是1/2/3/4/5/6...... 参考技术C 第几个的意思

H5-伪类选择器-伪元素选择器

参考技术A H5规定

1.伪类使用单冒号

2.伪元素使用双冒号

注意:同级

E:first-child 第一个子元素

E:last-child 最后一个元素

E:nth-child(n) 第n个

E:nth-last-child(n)倒数第n个

E:nth-child(odd)奇数

E:nth-child(even)偶数

E:nth-child(-n+3)前三个

E:nth-last-child(-n+3)后三个

E:nth-of-type(n)第n个同级兄弟元素E

E:nth-child(3n + 1)  1,4,7

E:nth-child(3n +3 ) 3的倍数

1.伪元素只能给双标签加

2.必须写上属性content:" ";

3.js获取不到伪元素

E:before  在E元素前插入一个元素

E:after 在E元素后插入一个元素

E:first-letter 选择到E容器内的第一个字母

E:first-line 选择到E容器内的第一行文本