Question

我想用橙色的h2设置偶数标题。我需要使用nth-child。我无法弄清楚我做错了什么......

    *{
        font-size: 1em;  
    }
    h2{
       font-size: 1.5em
    }
    h2:first-letter{font-size: 150%}
    h2:nth-child(odd){
       color:#ef3909;
    }

css中的最后一行有nth-child无法正常工作。提前致谢

Answer 1

您必须将 n-child（偶数）设置为<h2>元素。

＆＃13;

.main article:nth-child(even) h2 {
  color: orange;
}

＆＃13;

<div class="main">
            <article>
               <a id="welkom"><h2>Welkom</h2></a>
               <p>
                  Dakwerken Jellen is al jaren de <strong>specialist in dakwerken</strong>. 
               </p>
            </article>
            
            <article>
               <a id="platteDaken"><h2>Platte daken</h2></a>
         
            </article>
            <article>
               <a id="gevelbekleding"><h2>Gevelbekleding</h2></a>
               <p>
                  Naast dakbedekking staan wij ook in voor de bekleding van gevels. U
               </p>
            </article>
            <article>
               <a id="zinkwerken"><h2>Zinkwerken</h2></a>
               <p>
                  Zink is reeds vele jaren een van de betere materialen om de regen via dakgoten te laten afvoeren. 
               </p>
            </article>
            <article>
               <a id="referenties"><h2>Referenties</h2></a>
               <p>
                 Een aantal referenties ...
               </p>
            </article>
         </div>
      </div>

＆＃13;

Answer 2

使用`nth-child（）对于新的

来说有点混乱

这是css的代码

.main article:nth-child(2n) h2{
    color: orange;
}

see demo

css nth-child不工作（nth-of-type）

2 个答案: