二重線囲み枠の線のサイズを変える方法

二重線の囲み枠の

サイズを変えてみたい

ということはありませんか？

 

特に淡いカラーの囲み枠は

サイズを変えると雰囲気が変わるので

やさしい雰囲気で強調させたい

というときにオススメです。

 

 

今回は

文字数に合わせてサイズが変わるゴールドっぽい枠線を例に、サイズを変える方法をご紹介します。

 

二重線の囲み枠

 

<div style="display:inline-block; border: 4px double #DFC69B; padding: 15px;">本文はここに入力してください。
改行はShift+Enterで！</div>
 
二重線のサイズは↑の
4のところを変更します。
 
 
5にしてみると…
同じカラーですが線が濃く見えますね。
二重線の囲み枠（サイズ5）
 
<div style="display:inline-block; border: 5px double #DFC69B; padding: 15px;">本文はここに入力してください。
改行はShift+Enterで！</div>
 
 
6にするとまた感じが変わります。
二重線の囲み枠（サイズ6）
 
<div style="display:inline-block; border: 6px double #DFC69B; padding: 15px;">本文はここに入力してください。
改行はShift+Enterで！</div>
 
 
6よりも7の方がスッキリするかな？
二重線の囲み枠（サイズ7）
 
<div style="display:inline-block; border: 7px double #DFC69B; padding: 15px;">本文はここに入力してください。
改行はShift+Enterで！</div>
 
 
8になると、かなり太い感じになります。
二重線の囲み枠（サイズ8）
 
<div style="display:inline-block; border: 8px double #DFC69B; padding: 15px;">本文はここに入力してください。
改行はShift+Enterで！</div>
 
 
カラーや太さをアレンジして
お好みの二重線を楽しんでくださいね♡
 
 

 

 

 

 

 

 

 

LINEの友だち追加で
「アメブロで使えるかわいいマーカー」
をプレゼントしています！

「マーカー」とメッセージを送ってねドキドキ

友だち追加

ID検索は @570smkow