簡単!CSSでテキストの一文字目を大きくしてみよう

一文字を大きくするTOP

画像じゃなくCSSでテキストの一文字目を大きくしたいと思ったことありませんか?

CSSなら、あなたの思い通りに文字の大きさやテキストの色が実現可能です!

では早速、CSSで見出しやキャッチコピーの一文字目を大きくしたり色を付けて目立たせてみよう!

Sponsored Links

CSS ではじめの一文字を大きくするドロップキャップの方法

HTML

<div class="textbig">今売れています!</div>
<h3 class="textbig" id="chapter3">今売れています!</h3>

CSS

.textbig {
 font-size:26px;
}
 
.textbig:first-letter {
 font-size:50px;
 color:#ff0000;
}

first-letter の属性を使うことで先頭の一文字目が大きくできます。

【例】

今売れています!

Sponsored Links

よろしければシェアお願いします