グリーン系のタイトルボックス囲み枠

グリーン系のタイトルボックス囲み枠 [ 角丸タイトルボックス・角丸タイトルラベル ] です。

角丸タイトルボックス囲み枠

<p>&nbsp;</p><div style="padding:10px 18px;background:#B0E0E6;border-top-left-radius: 10px; 
border-top-right-radius: 10px;"><span style="font-weight:bold; color:#ffffff;">ここにタイトル</span></div><div style="border:2px solid #B0E0E6; padding:15px;border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;">ここに本文。角丸グリーン1</div><p>&nbsp;</p>

<p>&nbsp;</p><div style="padding:10px 18px;background:#B1DCD5;border-top-left-radius: 10px; 
border-top-right-radius: 10px;"><span style="font-weight:bold; color:#ffffff;">ここにタイトル</span></div><div style="border:2px solid #B1DCD5; padding:15px;border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;">ここに本文。角丸グリーン2</div><p>&nbsp;</p>

<p>&nbsp;</p><div style="padding:10px 18px;background:#C1D7A2;border-top-left-radius: 10px; 
border-top-right-radius: 10px;"><span style="font-weight:bold; color:#ffffff;">ここにタイトル</span></div><div style="border:2px solid #C1D7A2; padding:15px;border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;">ここに本文。角丸グリーン3</div><p>&nbsp;</p>

<p>&nbsp;</p><div style="padding:10px 18px;background:url(https://atelier-plume.net/wp-content/uploads/2022/07/dotgreen.png);border-top-left-radius: 10px; border-top-right-radius: 10px;"><span style="font-weight:bold; ">ここにタイトル</span></div><div style="border:2px solid #DDF1EE; padding:15px;border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;">ここに本文。角丸水玉</div><p>&nbsp;</p>

角丸タイトルラベル囲み枠

<p>&nbsp;</p><div style="display:inline-block;padding:10px 18px;background:#B0E0E6;
border-top-left-radius: 10px; border-top-right-radius: 10px;"><span style="font-weight:bold; color:#ffffff;">ここにタイトル</span></div>
<div style="border:2px solid #B0E0E6; padding:15px;border-top-right-radius: 10px;border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;">ここに本文。角丸グリーン1</div><p>&nbsp;</p>

<p>&nbsp;</p><div style="display:inline-block;padding:10px 18px;background:#B1DCD5;
border-top-left-radius: 10px; border-top-right-radius: 10px;"><span style="font-weight:bold; color:#ffffff;">ここにタイトル</span></div>
<div style="border:2px solid #B1DCD5; padding:15px;border-top-right-radius: 10px;border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;">ここに本文。角丸グリーン2</div><p>&nbsp;</p>

<p>&nbsp;</p><div style="display:inline-block;padding:10px 18px;background:#C1D7A2;
border-top-left-radius: 10px; border-top-right-radius: 10px;"><span style="font-weight:bold; color:#ffffff;">ここにタイトル</span></div>
<div style="border:2px solid #C1D7A2; padding:15px;border-top-right-radius: 10px;border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;">ここに本文。角丸グリーン3</div><p>&nbsp;</p>

<p>&nbsp;</p><div style="display:inline-block;padding:10px 18px;background:url(https://atelier-plume.net/wp-content/uploads/2022/07/dotgreen.png);border-top-left-radius: 10px; border-top-right-radius: 10px;"><span style="font-weight:bold;">ここにタイトル</span></div>
<div style="border:2px solid #DDF1EE; padding:15px;border-top-right-radius: 10px;border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;">ここに本文。角丸水玉</div><p>&nbsp;</p>