2016-05-22 8 views
1

私はこの作業を得ることができないようです。あなたが必要とする最初の要素のでli:nth-child(7n+11)を使用する必要がスタッガー:最初の選択後のn番目の子供?

<li>1</li> 
<li>2</li> 
<li>3</li> 
<li>4</li> 
<li>5</li> 
<li>6</li> 
<li>7</li> 
<li>8</li> 
<li>9</li> 
<li>10</li> 
<li>11</li> //initial selected 
<li>12</li> 
<li>13</li> 
<li>14</li> 
<li>15</li> 
<li>16</li> 
<li>17</li> 
<li>18</li> //selected 
<li>19</li> 
<li>20</li> 
<li>21</li> 
<li>22</li> 
<li>23</li> 
<li>24</li> 
<li>25</li> //selected 

CSS

div:nth-child(11){ 
    color:#00b2ee; 
} 

答えて

2

:私は最初の11日、選択

HTML後li史上7位11 liと色で開始する必要があります(これはan + bbに入っています)、そこから7番目の要素が選択されるはずです(したがって、7はのの部分)。

スニペットでは、li:nth-of-type(7n+11)のデモも含めました。両方のセレクタはli要素に対して同じ方法で動作します。li要素のみがulの下に直接存在することが許可されており、他の種類の子要素が存在する可能性がないためです。

li:nth-child(7n+11) { 
 
    color: #00b2ee; 
 
} 
 
li:nth-of-type(7n+11) { 
 
    background: beige; 
 
}
<ul> 
 
    <li>1</li> 
 
    <li>2</li> 
 
    <li>3</li> 
 
    <li>4</li> 
 
    <li>5</li> 
 
    <li>6</li> 
 
    <li>7</li> 
 
    <li>8</li> 
 
    <li>9</li> 
 
    <li>10</li> 
 
    <li>11</li> 
 
    <li>12</li> 
 
    <li>13</li> 
 
    <li>14</li> 
 
    <li>15</li> 
 
    <li>16</li> 
 
    <li>17</li> 
 
    <li>18</li> 
 
    <li>19</li> 
 
    <li>20</li> 
 
    <li>21</li> 
 
    <li>22</li> 
 
    <li>23</li> 
 
    <li>24</li> 
 
    <li>25</li> 
 
</ul>

関連する問題