目次

コピペで使えるの「ワッペン風の囲み枠(デニム調)」HTMLタグ16種類

コピペで使えるHTMLタグ「デニム調のワッペン風の囲み枠」を作ってみました。

デニム生地風の自作画像を使ったもの8種類と、CSSでデニムっぽく作ったもの8種類の、合計16種類用意しました。

囲み枠の表示サンプル(見本)の中に貼り付け用のHTMLタグがあると思いますので、よかったらコピペで使ってください。

画像を使った囲み枠

貼り付け用のHTMLタグ内の画像はimages.weserv.nlという無料の画像キャッシュサービスを経由していますので、ご承知おきください。

デニム調 画像1

ワッペン風の囲み枠(デニム調 画像1)

デニム調 画像2

ワッペン風の囲み枠(デニム調 画像2)

デニム調 画像3

ワッペン風の囲み枠(デニム調 画像3)

デニム調 画像4

ワッペン風の囲み枠(デニム調 画像4)

デニム調 画像5

ワッペン風の囲み枠(デニム調 画像5)

デニム調 画像6

ワッペン風の囲み枠(デニム調 画像6)

デニム調 画像7

ワッペン風の囲み枠(デニム調 画像7)

デニム調 画像8

ワッペン風の囲み枠(デニム調 画像8)

CSS版(画像を使わない)囲み枠

こちらは、画像を一切使わずCSSだけで表現していますっていませんので、見た目は画像版に劣ると思いますが、万が一にも画像が消えて表示されなくなる心配はありません。

デニム調 CSS1

ワッペン風の囲み枠(デニム調 CSS1)

デニム調 CSS2

ワッペン風の囲み枠(デニム調 CSS2)

デニム調 CSS3

ワッペン風の囲み枠(デニム調 CSS3)

デニム調 CSS4

ワッペン風の囲み枠(デニム調 CSS4)

デニム調 CSS5

ワッペン風の囲み枠(デニム調 CSS5)

デニム調 CSS6

ワッペン風の囲み枠(デニム調 CSS6)

デニム調 CSS7

ワッペン風の囲み枠(デニム調 CSS7)

デニム調 CSS8

ワッペン風の囲み枠(デニム調 CSS8)

関連記事