HP制作先着3名様まで(残2)80,000円(税込)

水色系のシンプルな囲み枠線

水色・ラベンダー系の囲み枠 [ シンプル・二重線・点線・破線 ] です。

囲み枠下のコードの右上にある四角のボタンを押すとコピーできます
アメブロの『HTML表示』に貼り付けてお使いください。

Contents

シンプルな囲み枠

シンプル1
<p>&nbsp;</p><div style="border: 2px solid #DBE8F9; padding: 15px;">ここに本文。シンプル1</div><p>&nbsp;</p>
シンプル2
<p>&nbsp;</p><div style="border: 2px solid #EDECFA; padding: 15px;">ここに本文。シンプル2</div><p>&nbsp;</p>
シンプル3
<p>&nbsp;</p><div style="border: 2px solid #89C3EB; padding: 15px;">ここに本文。シンプル3</div><p>&nbsp;</p>
シンプル4
<p>&nbsp;</p><div style="border: 2px solid #DECBF4; padding: 15px;">ここに本文。シンプル4</div><p>&nbsp;</p>

二重線の囲み枠

二重線1
<p>&nbsp;</p><div style="border: 4px double #DBE8F9; padding: 15px;">ここに本文。二重線1</div><p>&nbsp;</p>
二重線2
<p>&nbsp;</p><div style="border: 4px double #EDECFA; padding: 15px;">ここに本文。二重線2</div><p>&nbsp;</p>
二重線3
<p>&nbsp;</p><div style="border: 4px double #89C3EB; padding: 15px;">ここに本文。二重線3</div><p>&nbsp;</p>
二重線4
<p>&nbsp;</p><div style="border: 4px double #DECBF4; padding: 15px;">ここに本文。二重線4</div><p>&nbsp;</p>

点線の囲み枠

点線1
<p>&nbsp;</p><div style="border: 2px dotted #DBE8F9; padding: 15px;">ここに本文。点線1</div><p>&nbsp;</p>
点線2
<p>&nbsp;</p><div style="border: 2px dotted #EDECFA; padding: 15px;">ここに本文。点線2</div><p>&nbsp;</p>
点線3
<p>&nbsp;</p><div style="border: 2px dotted #89C3EB; padding: 15px;">ここに本文。点線3</div><p>&nbsp;</p>
点線4
<p>&nbsp;</p><div style="border: 2px dotted #DECBF4; padding: 15px;">ここに本文。点線4</div><p>&nbsp;</p>

破線の囲み枠

破線1
<p>&nbsp;</p><div style="border: 2px dashed #DBE8F9; padding: 15px;">ここに本文。破線1</div><p>&nbsp;</p>
破線2
<p>&nbsp;</p><div style="border: 2px dashed #EDECFA; padding: 15px;">ここに本文。破線2</div><p>&nbsp;</p>
破線3
<p>&nbsp;</p><div style="border: 2px dashed #89C3EB; padding: 15px;">ここに本文。破線3</div><p>&nbsp;</p>
破線4
<p>&nbsp;</p><div style="border: 2px dashed #DECBF4; padding: 15px;">ここに本文。破線4</div><p>&nbsp;</p>

サイズが変わるシンプルな囲み枠

シンプル1
<p>&nbsp;</p><div style="display:inline-block;border: 2px solid #DBE8F9; padding: 15px;">ここに本文。シンプル1</div><p>&nbsp;</p>
シンプル2
<p>&nbsp;</p><div style="display:inline-block;border: 2px solid #EDECFA; padding: 15px;">ここに本文。シンプル2</div><p>&nbsp;</p>
シンプル3
<p>&nbsp;</p><div style="display:inline-block;border: 2px solid #89C3EB; padding: 15px;">ここに本文。シンプル3</div><p>&nbsp;</p>
シンプル4
<p>&nbsp;</p><div style="display:inline-block;border: 2px solid #DECBF4; padding: 15px;">ここに本文。シンプル4</div><p>&nbsp;</p>

サイズが変わる二重線の囲み枠

二重線1
<p>&nbsp;</p><div style="display:inline-block;border: 4px double #DBE8F9; padding: 15px;">ここに本文。二重線1</div><p>&nbsp;</p>
二重線2
<p>&nbsp;</p><div style="display:inline-block;border: 4px double #EDECFA; padding: 15px;">ここに本文。二重線2</div><p>&nbsp;</p>
二重線3
<p>&nbsp;</p><div style="display:inline-block;border: 4px double #89C3EB; padding: 15px;">ここに本文。二重線3</div><p>&nbsp;</p>
二重線4
<p>&nbsp;</p><div style="display:inline-block;border: 4px double #DECBF4; padding: 15px;">ここに本文。二重線4</div><p>&nbsp;</p>

サイズが変わる点線の囲み枠

点線1
<p>&nbsp;</p><div style="display:inline-block;border: 2px dotted #DBE8F9; padding: 15px;">ここに本文。点線1</div><p>&nbsp;</p>
点線2
<p>&nbsp;</p><div style="display:inline-block;border: 2px dotted #EDECFA; padding: 15px;">ここに本文。点線2</div><p>&nbsp;</p>
点線3
<p>&nbsp;</p><div style="display:inline-block;border: 2px dotted #89C3EB; padding: 15px;">ここに本文。点線3</div><p>&nbsp;</p>
点線4
<p>&nbsp;</p><div style="display:inline-block;border: 2px dotted #DECBF4; padding: 15px;">ここに本文。点線4</div><p>&nbsp;</p>

サイズが変わる破線の囲み枠

破線1
<p>&nbsp;</p><div style="display:inline-block;border: 2px dashed #DBE8F9; padding: 15px;">ここに本文。破線1</div><p>&nbsp;</p>
破線2
<p>&nbsp;</p><div style="display:inline-block;border: 2px dashed #EDECFA; padding: 15px;">ここに本文。破線2</div><p>&nbsp;</p>
破線3
<p>&nbsp;</p><div style="display:inline-block;border: 2px dashed #89C3EB; padding: 15px;">ここに本文。破線3</div><p>&nbsp;</p>
破線4
<p>&nbsp;</p><div style="display:inline-block;border: 2px dashed #DECBF4; padding: 15px;">ここに本文。破線4</div><p>&nbsp;</p>
share
  • URLをコピーしました!
  • URLをコピーしました!
Contents