使い方
①テキストパーツの「<>」を開く
②使いたいデザインのソースコードを貼り付ける
③「保存」を押して「ここに本文を入れます」のテキスト部分を書き換える
※テキストを改行する場合はShift+Enterをお使いください
囲み枠
シンプル
<div style="border: #ffb6c1 solid 1px; font-size: 100%; padding: 20px;">ここに本文を入れます</div>
太線
<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; border: #ffb6c1 solid 3px; font-size: 100%; padding: 20px;">ここに本文を入れます</div>
付箋風
<div style="border-left: #ffb6c1 solid 10px; background-color: #fef9fb; font-size: 100%; padding: 20px;">ここに本文を入れます</div>
背景色つき
<div style="background: #ffd8d8; box-shadow: #ffd8d8 0 0 10px 10px; margin: 10px; font-size: 100%; padding: 20px;">ここに本文を入れます</div>
点線1
<div style="border-radius: 1px; border: 4px dotted #ffb6c1; font-size: 100%; padding: 20px;">ここに本文を入れます♪</div>
点線2
<div style="border-radius: 5px; border: 1px dashed #ffb6c1; font-size: 100%; padding: 20px;">ここに本文を入れます</div>
ステッチ風
<div style="background: #ffe6e8; padding: 20px; border: 2px dashed #ffb6c1; box-shadow: 0 0 0 5px #ffe6e8; -moz-box-shadow: 0 0 0 5px #ffe6e8; -webkit-box-shadow: 0 0 0 5px #ffe6e8; font-size: 100%;">ここに本文を入れます</div>
最終更新日: