スタンプ状のテキスト

テキストと背景を組み合わせて、スタンプのような見出しを作成する

ボックスサイズを設定して背景画像を適用し、見出しのテキストを上下左右中央に配置する

背景の中央にテキストを配置する

マークのような、スタンプのようなデザインの見出しを作成する

タグには <h2> を使用し、130px × 130px のボックスを作成して、ビューポートの中央に配置する

下マージンは 30px に設定して他のモジュールとくっつかないようにする

テキストをボックスの上下左右中央に配置する

CSS でグリッドレイアウトを使う

ボックスの上下左右中央に子要素（テキストも子要素）を配置する方法

上下左右中央揃えにしたい要素の親要素に、以下のスタイルを適用する

display: grid;
place-items: center;

要素に背景画像を適用するときは、可能な限り SVG 形式のファイルを用意する

SVG ファイルの画像は「ベクター形式」で、拡大・縮小しても画質が劣化しない

PNG、JPEG の画像に比べると背景画像に使用したときの大きさの調整が容易で、一般的にはファイルサイズが小さい