WP文字囲みコード集

Life
この記事は約4分で読めます。
ここに文章を記載する

<div style=”border: 5px solid #91D8AC; padding: 10px; border-radius: 10px; background: ;”>ここに文章を記載する</div>

ここに文章を記載する
<div style=”border: 5px double #91D8AC; padding: 10px; border-radius: 10px; background: ;”>ここに文章を記載する</div>
 
 
ここに文章を記載する
<div style=”border:5px dashed #91D8AC;padding:10px;border-radius:10px;”>ここに文章を記載する</div>
 
 
ここに文章を記載する
<div style=”border:5px dotted #0CF;padding:10px;border-radius:10px;”>ここに文章を記載する</div>
 
 
ここに文章を記載
<div style=”background: #F2EAD4; padding: 15px; border: 0px solid #F2EAD4; border-radius: 10px; word-break: break-all;”>ここに文章を記載</div>
 
 
見出しタイトル

囲み内の文章

<div> <div style=”height: 12px;”><span style=”background: #91D8AC; padding: 6px 10px; border-radius: 5px; color: #ffffff; font-weight: bold; margin-left: 10px;”>見出しタイトル</span></div> <div style=”padding: 30px 15px 10px; border-radius: 5px; border: 2px solid #91D8AC;”> <p><span style=”font-size: 16px;”>囲み内の文章</span></p> </div> </div>

ここに文章を記載する
<div style=”border:5px solid #F90;padding:10px;border-radius:10px;”>ここに文章を記載する</div>
 
 
ここに文章を記載する
<div style=”border: 5px solid #F90; padding: 10px; border-radius: 10px; background: #FFDBA6;”>ここに文章を記載する</div>
 
 
ここに文章を入力します
<div style=”background: #F7F7F7; padding: 10px; “>ここに文章を入力します</div>
 
 
 
ここに文章を入力します
<div style=”background: #F7F7F7; border: 7px double #A1A1A1; padding: 10px;”>ここに文章を入力します</div>
 
<div style=”background: #F7F7F7; border: 4px double #A1A1A1; box-shadow: 0 0 0 10px #F7F7F7; padding: 10px;”>ここに文章を入力します</div>
 
 
ここに文章を入力します
<div style=”background: #F0F8FF; border: 1px solid #6091D3; padding: 10px;”>ここに文章を入力します</div>
 
 
 
 
ここに文章を入力します
 
<div style=”background: #FFF4F4; padding: 10px;”>ここに文章を入力します</div>
 
 
ここに文章を入力します
 
<div style=”background: #FFF4F4; padding: 10px;”>ここに文章を入力します</div>
 
 
ここに文章を入力します
<div style=”background: #EAFFEA; border: 1px solid #43A047; padding: 10px;”>ここに文章を入力します</div>
 
 
ここに文章を入力します
<div style=”background: #EAFFEA; padding: 10px;”>ここに文章を入力します</div>

Follow me!

PAGE TOP
タイトルとURLをコピーしました