51CTO博客已为您找到关于css nth-child(even的相关内容,包含IT学习相关文档代码介绍、相关教程视频课程,以及css nth-child(even问答内容。更多css nth-child(even相关解答可以来51CTO博客参与分享和学习,帮助广大IT技术人实现成长和进步。
/*First*/li:nth-child(n+1){background:#999;}/*Second*/li:nth-child(2n-1){background:#999;} nth-child(even)nth-child(even):选择列表的偶数行。 举例:偶数行背景显示为土黄色(不要在意那些细节),代码如下: 代码语言:javascript 复制 li:nth-child(even){background:#F6E0AF;} 同样,我们可以通...
- `nth-child(even)`选择器对所有类型的元素都适用,而不仅仅是`li`元素。 - `nth-child(even)`选择器不仅限于选择偶数位置的元素,还可以选择满足其他条件的元素,例如`nth-child(2n + 3)`可以选择位置为3、5、7、9...的元素。 nth-child(even)是CSS伪类选择器之一,用于选取父元素下的偶数位置的子元素。
li:nth-child(-1n+8){background:blue;} 第五种:奇偶匹配 :nth-child(odd) 与:nth-child(even) 分别匹配序号为奇数与偶数的元素。奇数(odd)与(2n+1)结果一样;偶数(even)与(2n+0)及(2n)结果一样。 作者观点:表格奇偶数行定义样式就可以写成 .table > tr:nth-child(even) > td {background-color:...
css3 :nth-child()选择器的使用 一、nth-child() 1. nth-child(n):父元素下的第n个子元素,n>0,索引从1开始。不区分子元素类型。 2. nth-child(odd):父元素下的奇数子元素,等同于:nth-child(2n-1)。区分子元素类型。 3. ntn-child(even):父元素下的偶数子元素,等同于:nth-child(2n)。区分子...
CSS伪类选择器奇偶匹配nth-child(even)语法::nth-child(an+b)下⾯就把CSS3标准中nth-child()⽤法⼤致介绍给⼤家:CSS3伪类选择器:nth-child()简单的归纳下nth-child()的⼏种⽤法。第⼀种:简单数字序号写法 :nth-child(number)直接匹配第number个元素。参数number必须为⼤于0的整数。例⼦...
语法::nth-child(n) 说明::nth-child() 是CSS3的一个伪类选择器,匹配父元素中的第 n 个子元素,元素类型没有限制。 n可以是一个数字,一个关键字,或者一个公式。 下面用案例来说明各个常见的情况用法 原始效果demo <liv-for="item in listData">{{item.pname}}{{item.type}}{{item.LJTZJH}}{{item...
可以简单理解为等同于 p:nth-child(odd) p:nth-child(2n+0) 可以简单理解为等同于 p:nth-child(even) p:nth-child(n+2) 表示正向范围,从第2个p元素开始(包括第2个p元素)到最后一个p元素都添加背景色(这里范围指2-5) p:nth-child(-n+5) ...
:nth-child(odd) :nth-child(even) 隔选择子元素 :nth-child(3n+1), 选择1,4,7,10 范围高级用法 nth-child(n+2):nth-child(odd):nth-child(-n+9) 使用nth-child(n+2):nth-child(odd):nth-child(-n+9) 我们将会选中的子元素是从第2位到第9位,并且只包含奇数位。
li:nth-child(even) { background:#0000ff; } 3、倍数 li:nth-child(2n) { background: #ff0000; border-bottom: 1px; } ... 4、公式:隔选择子元素,选择1,4,7,10 li:nth-child(3n+1) { background: #ff0000; border-bottom: 1px; } 5...