0

グループの2番目の子であるH1要素を選択しようとしていますが、機能していないようです。CSSは以下のとおりです。

.midLeftIn h1:nth-child(1) {
    color:#f89859;
    text-transform: uppercase;
    font-size: 18px;
    letter-spacing: 3px;
    border-bottom: solid 2px #FFF;

}

.midLeftIn h1:nth-child(2) {
    color:#000;
    text-transform: uppercase;
    font-size: 18px;
    letter-spacing: 3px;
    border-bottom: solid 2px #FFF;

}

WordPress outは、以下に示すようにHTMLを出力します

<div class="midLeftIn">



          <h1>We&#8217;re willing to help</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sed fermentum purus. Integer gravida, neque ac placerat consequat, diam dolor gravida nibh, a venenatis tortor justo non velit. Cras fringilla tincidunt justo eu pulvinar. Phasellus at mauris nec odio sagittis gravida. Etiam bibendum semper libero in dapibus.</p>

<p>Phasellus vulputate, lectus vitae rhoncus dapibus, eros magna bibendum felis, eget placerat neque diam id arcu. Integer vel fringilla erat. Nulla volutpat placerat elit at ornare.Praesent accumsan ultrices mi, sed cursus magna adipiscing eu. Aenean porttitor nisi quis arcu luctus non imperdiet elit porta.  <div style='height:25px; padding:0; margin:0; '  ></div></p>

<h1>Another good thing</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sed fermentum purus. Integer gravida, neque ac placerat consequat, diam dolor gravida nibh, a venenatis tortor justo non velit. Cras fringilla tincidunt justo eu pulvinar. Phasellus at mauris nec odio sagittis gravida. Etiam bibendum semper libero in dapibus.</p>
<p>Phasellus vulputate, lectus vitae rhoncus dapibus, eros magna bibendum felis, eget placerat neque diam id arcu. Integer vel fringilla erat. Nulla volutpat placerat elit at ornare.Praesent accumsan ultrices mi, sed cursus magna adipiscing eu. Aenean porttitor nisi quis arcu luctus non imperdiet elit porta.   <div style='height:25px; padding:0; margin:0; '  ></div></p>

<h1>Something nice goes here</h1>
<p style="text-align: justify;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sed fermentum purus. Integer gravida, neque ac placerat consequat, diam dolor gravida nibh, a venenatis tortor justo non velit. Cras fringilla tincidunt justo eu pulvinar. Phasellus at mauris nec odio sagittis gravida. Etiam bibendum semper libero in dapibus.</p>

<p style="text-align: justify;">Phasellus vulputate, lectus vitae rhoncus dapibus, eros magna bibendum felis, eget placerat neque diam id arcu. Integer vel fringilla erat. Nulla volutpat placerat elit at ornare.Praesent accumsan ultrices mi, sed cursus magna adipiscing eu. Aenean porttitor nisi quis arcu luctus non imperdiet elit porta. <div style='height:25px; padding:0; margin:0; '  ></div>


</div><!-- End MidLeftIn -->





</div><!-- End MidLeftIn -->
4

1 に答える 1

1

h1n番目の子をそれぞれ選択しようとしていますか？

もしそうなら、あなたはそれらをあなたの中で他の兄弟と:nth-of-type()区別するために代わりに使う必要があります、それはそのすべての兄弟に対する要素の位置だけを考慮に入れるからです：pdiv:nth-child()

.midLeftIn h1:nth-of-type(1)
.midLeftIn h1:nth-of-type(2)
于 2012-08-05T17:23:51.420 に答える