クラスのスタイルが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>