Question

css选择器nth-child 实现一个范围吗

Answer 1

nth-child可以选择单个元素，也可以实现一个范围，如:

<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
</ul>
上面是一个列表

1.选择单个标签元素（指定序列的单个元素）.
li:nth-child(1)
{
    color: red;
}
执行上面的CSS，<li>1</li>在界面上面表现为红色

2.选择一个范围的标签元素（偶数序列的元素）.
li:nth-child(2n)
{
    color: red;
}
执行上面的CSS，<li>2</li><li>4</li><li>6</li>在界面上显示红色
上面的CSS还可以如下面这样写：
li:nth-child(even)
{
    color: red;
}
这两个CSS都代表选择li所在的顺序为偶数位置的标签元素。

3.奇数序列的元素使用odd或者2n+1

Answer 2

可以这样写：
li:nth-child(n+2):nth-child(-n+5)
其中n+2表示从第二个开始，-n+5表示第五个结束。
亲测好用。

Answer 3

:nth-child(n)
n可以是数字，关键字或公式，这个不能说是范围，因为它指的东西太多了，是css3的一个选择器，具体你可以去w3school看看他的用法