フリー素材|囲み枠、飾り枠-02
上下水玉の囲み枠、飾り枠
frame02-a
htmlとcssは共通画像は使用するものを保存してください
別の画像を使用してもOKです
- ▼html/css/img▼
-
html
<div class="box02"> <div class="box-inner"> ここに文字 </div> </div>
css.box02{ background:url(back01.gif); border:solid 1px #483b3c; margin:1em 0; /* 中央寄せは0をautoに変更 */ padding:20px 0; width:80% /* 幅 */ } .box-inner{ background:#fff; border-bottom:2px dashed #c3c2ad; border-top:2px dashed #c3c2ad; box-shadow:0 4px 0 #fff,0 -4px 0 #fff; padding:15px }
image
× close
frame02-b
frame02-c
frame02-d
frame02-e
カスタマイズサンプル
背景画像削除
backgroundをカラーコードで指定
角に丸み
cssにborder-radius:5pxを追加