パーツ番号 07-05-11 ・ CSSのみ

波線区切り

なめらかな正弦波を1本描いた静止した区切り線です。柔らかい印象を出したいブログ記事や写真ギャラリーのセクション間の仕切りに使えます。

staticcss

プレビュー

ソースコード

HTML

<svg class="d07-05-11-svg" viewBox="0 0 320 24" width="100%" height="24" preserveAspectRatio="none" aria-hidden="true">
          <path d="M0 12 Q20 0 40 12 T80 12 T120 12 T160 12 T200 12 T240 12 T280 12 T320 12" fill="none" stroke="#999" stroke-width="2"/>
        </svg>

CSS

.d07-05-11-svg{ display:block; max-width:320px; }

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