Question

我想选择以下顺序的div：

div3,div4
div7,div8
div11,div12
div15,div16
and so on....

我想知道，我如何通过CSS的第n个子属性实现此顺序？请帮忙!!!

Answer 1

在不了解您的结构的情况下很难确定，但nth-of-type选择器可以在这里提供帮助。

div:nth-of-type(4n+3) {  /* every 4th div starting at 3 */
  background: red;
}
div:nth-of-type(4n+4) {  /* every 4th div starting at 4 */
  background:blue;
}

JSfiddle Demo

Answer 2

使用以下内容：

div:nth-child(4n-1){} /* for 3,7,11,15... */

div:nth-child(4n){} /* for 4,8,12,16... */

以下片段：

＆＃13;

div:nth-child(4n-1){
    background: red;
}
div:nth-child(4n){
    background: green;
}

＆＃13;

<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
<div>7</div>
<div>8</div>
<div>9</div>
<div>10</div>
<div>11</div>
<div>12</div>
<div>13</div>
<div>14</div>
<div>15</div>
<div>16</div>

＆＃13;

Answer 3

在CSS中，

div:nth-child(4n+3),
div:nth-child(4n+4){
   /*do something*/
}

如何从CSS中选择div？

3 个答案: