CSS3 序选择器运算公式

<p>我是段落1</p>
<p>我是段落2</p>
<p>我是段落3</p>
<p>我是段落4</p>
<p>我是段落5</p>
<p>我是段落6</p>
<p>我是段落7</p>
<p>我是段落8</p>
<p>我是段落9</p>
复制代码

需求 : 选中上面标签的 偶数 标签 , 而且设置文字颜色为 红色css

p:nth-child(2n){
    color:"red";
}
复制代码

需求 : 选中上面标签的 奇数 标签 , 而且设置文字颜色为 蓝色bash

p:nth-child(2n + 1){
   color:"blue";
}
复制代码

因此重点了解一下 nth-child(xn+y)spa

:nth-child(xn+y)
           x : 用户自定义
           n : 查看选择了多少个元素, 从零开始依次递增元素 
           y : 用户自定义      (使用 xn 运算后的结果 + y 得出最后的结果)

       注意点 : 
           y 是能够被省略  :nth-child(xn)
复制代码
选择偶数 
       nth-child(2n)
       选择奇数
       nth-child(2n + 1)
       选择 3 的倍数
       nth-child(3n)
复制代码
相关文章
相关标签/搜索