パーツ番号 02-07-35 ・ CSSのみ

グリッド背景見出し

方眼紙のような薄いグリッド線を背景に敷いた見出し。制作実績やポートフォリオセクションのタイトルに落ち着いた印象を与える。

staticcss

プレビュー

ソースコード

HTML

<div class="wrap">
          <h4 class="ttl">Our Portfolio</h4>
        </div>

CSS

.d02-07-35 .wrap{ padding:28px 20px; text-align:center; background-color:#fafafa; background-image:linear-gradient(#e5e7eb 1px, transparent 1px), linear-gradient(90deg, #e5e7eb 1px, transparent 1px); background-size:16px 16px; }
        .d02-07-35 .ttl{ all:unset; display:inline-block; padding:6px 16px; background:#fff; font-size:22px; font-weight:800; color:#1f2937; }

クラス名 .d02-07-35 は本ライブラリ内での識別用です。複数のパーツを同じページで使う場合は、重複しないよう名前を変更してください。