如何使用nth-child定位除第一个之外的所有元素?

时间:2012-08-30 08:46:22

标签: html css css-selectors

如何使用:nth-child运算符定位第一个DIV旁边的所有段落?

:nth-child(/* select all but the first one */) {
     color: green;
}
<div>
    <p>Example 1</p>
    <p>Example 2</p>
    <p>Example 3</p>
    <p>Example 4</p>
    <p>Example 5</p>
    <p>Example 6</p>
    <p>Example 7</p>
</div>

3 个答案:

答案 0 :(得分:9)

您可以使用以下公式:

:nth-child(n+1)

或某些浏览器:

:nth-child(n+2)

W3Schools说:

  

使用公式(a + b)。描述:a表示循环大小,n是计数器(从0开始),b是偏移值。

     

Link

或者您可以为第一个元素使用单独的:first-child CSS声明。

答案 1 :(得分:4)

使用

p:nth-child(n+2) {
    color: green;   
}

working DEMO

Reference

答案 2 :(得分:2)

尝试

div > p:nth-child(n+2)

http://jsfiddle.net/Q6FDq/

演示