ウェブサイト改善Tips

最初の文字にのみcssを適用させる

2012-01-26

よく、雑誌の記事などで、最初の1文字だけ大きくなっているのを見かけませんか？

 

■例：1

最初の文字にのみcssを適用させる

 

こちら、「first-letter」にcssを指定するだけで、簡単に表示できます。

 

【html】

1

<p class="sample">最初の文字にのみcssを適用させる</p>

 

【css】

1
2
3
4
5
6
7
8
9

.sample:first-letter {
    font-weight:bold;
    font-size:1.5em;
}
 
.sample {
    margin: 0px;
    padding: 0px;
}



関連記事