0

クラスのスタイルがtitle_servicesすべて適用され、 title_services2クラスのみが適用される理由を知っている人はいますline-height, font-weight; letter-spacingか? Tool for Developers を Chrome で使用して選択するh4.title_servicesと、すべてのスタイルが一覧表示されますが、選択するh4.title_services2と、これら 3 つのスタイルのみが表示されます。以下はCSSです(h4そしてh4.title_services正しく動作しますが、そうでh4.title_services2はありません)

h4 {
    font-size:28px; 
    line-height:2em; 
    color:#fff;
    font-weight:normal;
    letter-spacing:-1px;
}

h4.title_services {
        font-size:28px; 
        margin-top:15px;
        margin-bottom:15px;
        text-align:center;
        line-height:1em; 
        color:#fff;
        font-weight:normal;
        letter-spacing:-1px;
}

h4.title_services2 {
        font-size:28px; 
        margin-top:25px;
        margin-bottom:15px;
        text-align:center;
        line-height:1em; 
        color:blue;/*#fff;*/
        font-weight:normal;
        letter-spacing:-1px;
}

HTML は次のとおりです。

<article class="grid_3">
    <div class="indent-left">
    <img style="display: block; margin: 0 auto;" src="../images/services_kid.png" />
        <h4 class="title_services">First headline</h4>
    <div id="button2"><a class="button2" href="#">BUTTON</a></div>
    </div>
</article>
<article class="grid_3">
    <div class="indent-left">
    <img style="display: block; margin: 0 auto;" src="../images/services_kid2.png" />
        <h4 class="title_services2">Second headline</h4>
    <div id="button2"><a class="button2" href="#">CENÍK</a></div>
    </div>
</article>
4

1 に答える 1