1文字目のサイズを変更する

できあがりイメージ

つくりかた

Step2 1文字目を装飾する要素のCSSセレクタを探す

CSSのセレクタで h2 を探しましょう。

Step3 1文字目にCSSを指定する

擬似要素を追加します。
擬似要素を使うと、要素 (サンプルh2) の一部分にCSSを指定することができます。
first-letter は要素の最初の文字を指定する擬似要素で、h2のセレクタとは別に書きます。
書く場所はどこでも大丈夫ですが、h2のセレクタの近くに書くのがオススメです。

Step4 コードを書くかコピー＆ペーストする

コピーしたコードを目的の箇所にペースト（貼り付け）するか、直接書いてみましょう。

Step5 1文字目の文字サイズを変更する

font-size を追加して、文字のサイズを大きくしましょう。
サンプルでは font-size を 60px に、font-weight (文字の太さ) を600 に指定しています。

Step6 コードを書くかコピー＆ペーストする

コピーしたコードを目的の箇所にペースト（貼り付け）するか、直接書いてみましょう。

Step7 実際の見え方を確認する

文章の一番最初の文字が大きく、太くなっていたら完成です。