文字数に合わせてサイズが変わるオレンジ枠線

ハロウィンっぽいオレンジの枠線です。

文字数に合わせてサイズが変わります。

シンプルな枠線
角丸枠線
タイトル付き枠線
タイトル付き角丸枠線があります。

文字数に合わせてサイズが変わる枠線

実　線：solid

<div style="display:inline-block; border: 2px solid #F68C27; padding: 15px;">本文はここに入力してください。
改行はShift+Enterで！</div>

二重線：double

<div style="display:inline-block; border: 4px double #F68C27; padding: 15px;">本文はここに入力してください。
改行はShift+Enterで！</div>

点　線：dotted

<div style="display:inline-block; border: 2px dotted #F68C27; padding: 15px;">本文はここに入力してください。
改行はShift+Enterで！</div>

破　線：dashed

<div style="display:inline-block; border: 2px dashed #F68C27; padding: 15px;">本文はここに入力してください。
改行はShift+Enterで！</div>

文字数に合わせてサイズが変わる角丸枠線

実　線：solid

<div style="display:inline-block; border: 2px solid #F68C27; padding: 15px; border-radius: 10px;">本文はここに入力してください。
改行はShift+Enterで！</div>

二重線：double

<div style="display:inline-block; border: 4px double #F68C27; padding: 15px; border-radius: 10px;">本文はここに入力してください。
改行はShift+Enterで！</div>

点　線：dotted

<div style="display:inline-block; border: 2px dotted #F68C27; padding: 15px; border-radius: 10px;">本文はここに入力してください。
改行はShift+Enterで！</div>

破　線：dashed

<div style="display:inline-block; border: 2px dashed #F68C27; padding: 15px; border-radius: 10px;">本文はここに入力してください。
改行はShift+Enterで！</div>

文字数に合わせてサイズが変わるタイトルつき枠線

　タイトル　実　線：solid

<fieldset style="display:inline-block; border: 2px solid #F68C27; padding: 15px;"><legend>　タイトル　</legend>本文はここに入力してください。
改行はShift+Enterで！</fieldset>

　タイトル　二重線：double

<fieldset style="display:inline-block; border:4px double #F68C27; padding:15px;"><legend>　タイトル　</legend>本文はここに入力してください。改行はShift+Enterで！</fieldset>

　タイトル　点　線：dotted

<fieldset style="display:inline-block; border:2px dotted #F68C27; padding:15px;"><legend>　タイトル　</legend>本文はここに入力してください。改行はShift+Enterで！</fieldset>

　タイトル　破　線：dashed

<fieldset style="display:inline-block; border:2px dashed #F68C27; padding:15px;"><legend>　タイトル　</legend>本文はここに入力してください。改行はShift+Enterで！</fieldset>

文字数に合わせてサイズが変わるタイトルつき角丸枠線

　タイトル　実　線：solid

<fieldset style="display:inline-block; border: 2px solid #F68C27; padding: 15px; border-radius: 10px;"><legend>　タイトル　</legend>本文はここに入力してください。
改行はShift+Enterで！</fieldset>

　タイトル　二重線：double

<fieldset style="display:inline-block; border:4px double #F68C27; padding:15px; border-radius: 10px;"><legend>　タイトル　</legend>本文はここに入力してください。
改行はShift+Enterで！</fieldset>

　タイトル　点　線：dotted

<fieldset style="display:inline-block; border:2px dotted #F68C27; padding:15px; border-radius: 10px;"><legend>　タイトル　</legend>本文はここに入力してください。
改行はShift+Enterで！</fieldset>

　タイトル　破　線：dashed

<fieldset style="display:inline-block; border:2px dashed #F68C27; padding:15px; border-radius: 10px;"><legend>　タイトル　</legend>本文はここに入力してください。
改行はShift+Enterで！</fieldset>

ハロウィンシリーズ