皆さんに手軽にプレゼントする方法はないかと考えまして、
桜の写真を使った囲み枠を作ってみました。

使い方は簡単。
コードをコピーして記事投稿の「HTML表示」に貼り付けるのみ。
メッセージボードにも使えます。

・シンプル
・角丸背景
・影付きシンプル
・影付き角丸
の4種類16パターンをご用意しました。

\使っていただけたら、とっても嬉しいです/

シンプル


本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 

--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);"><div style="background:rgba(255,255,255,0.85);padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div>

二重線枠


本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border:4px double #eb6ea0;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border:4px double #c1ab05;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

左右二重線枠

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border-left:4px double #eb6ea0;border-right:4px double #eb6ea0;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border-left:4px double #c1ab05;border-right:4px double #c1ab05;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>
角丸シンプル

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);border-radius:10px;"><div style="background:rgba(255,255,255,0.85);padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div>
角丸二重線枠

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);border-radius:10px;"><div style="background:rgba(255,255,255,0.85);padding:5px;border-radius:5px;"><div style="border:4px double #eb6ea0;padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);border-radius:10px;"><div style="background:rgba(255,255,255,0.85);padding:5px;border-radius:5px;"><div style="border:4px double #c1ab05;padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>
写真影付き

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div>
写真影付き+二重線枠

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border:4px double #eb6ea0;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border:4px double #c1ab05;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>
写真影付き+左右二重線

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border-left:4px double #eb6ea0;border-right:4px double #eb6ea0;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:5px;"><div style="border-left:4px double #c1ab05;border-right:4px double #c1ab05;padding:20px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>
写真影付き+角丸

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);border-radius:10px;box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div>
写真影付き+角丸二重線枠

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);border-radius:10px;box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:5px;border-radius:5px;"><div style="border:4px double #eb6ea0;padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>

本文はここに入力してください。
改行はShift+Enterでお願いします。
スマホの方はHTML編集で<br>と入れて改行です。
 
--こちらのコードをコピペ--
<div style="padding:20px;margin:20px 0 20px 0;background:url(https://stat.ameba.jp/user_images/20210309/09/kuweb/1e/1c/p/o0640064014907655439.png);border-radius:10px;box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.85);padding:5px;border-radius:5px;"><div style="border:4px double #c1ab05;padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterでお願いします。スマホの方はHTML編集で<br>と入れて改行です。</div></div></div>
base_hover
↑Tシャツ作っています。チラッと覗いていただけたら、うれしいです
 

coconala_hover
↑ココナラでヘッダーやSNS用の画像各種、承っています。

 

リキュー_hover

↑アメブロカスタマイズを承っています。