マーブル背景囲み枠です。
メッセージボードや
記事下定型文におすすめです。
切り替わり部分がわかりにくいので長文にも!
- マーブル背景
- 角丸マーブル背景
- 影つきマーブル背景
- 影つき角丸マーブル背景
シンプルマーブル背景
本文はここに入力してください。
改行はShift+Enterで!
改行はShift+Enterで!
<div style="padding:16px;background:url(https://stat.ameba.jp/user_images/20231221/19/atelier-plume-net/3c/ea/j/o0650065015379736954.jpg);"><div style="background:rgba(255,255,255,0.7);padding:20px;">本文はここに入力してください。改行はShift+Enterで!</div></div>
本文はここに入力してください。
改行はShift+Enterで!
改行はShift+Enterで!
<div style="padding:16px;background:url(https://stat.ameba.jp/user_images/20231221/19/atelier-plume-net/3c/ea/j/o0650065015379736954.jpg);"><div style="background:rgba(255,255,255,0.7);border:4px double #E3E2DE;padding:20px;">本文はここに入力してください。改行はShift+Enterで!</div></div>
本文はここに入力してください。
改行はShift+Enterで!
改行はShift+Enterで!
<div style="padding:16px;background:url(https://stat.ameba.jp/user_images/20231221/19/atelier-plume-net/3c/ea/j/o0650065015379736954.jpg);"><div style="background:rgba(255,255,255,0.7);border:4px double #e8d5af;padding:20px;">本文はここに入力してください。改行はShift+Enterで!</div></div>
角丸マーブル背景
本文はここに入力してください。
改行はShift+Enterで!
改行はShift+Enterで!
<div style="padding:16px;background:url(https://stat.ameba.jp/user_images/20231221/19/atelier-plume-net/3c/ea/j/o0650065015379736954.jpg);border-radius:10px;"><div style="background:rgba(255,255,255,0.7);padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterで!</div></div>
本文はここに入力してください。
改行はShift+Enterで!
改行はShift+Enterで!
<div style="padding:16px;background:url(https://stat.ameba.jp/user_images/20231221/19/atelier-plume-net/3c/ea/j/o0650065015379736954.jpg);border-radius:10px;"><div style="background:rgba(255,255,255,0.7);border-radius:5px;border:4px double #E3E2DE;padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterで!</div></div>
本文はここに入力してください。
改行はShift+Enterで!
改行はShift+Enterで!
<div style="padding:16px;background:url(https://stat.ameba.jp/user_images/20231221/19/atelier-plume-net/3c/ea/j/o0650065015379736954.jpg);border-radius:10px;"><div style="background:rgba(255,255,255,0.7);border-radius:5px;border:4px double #e8d5af;padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterで!</div></div>
影つきマーブル背景
本文はここに入力してください。
改行はShift+Enterで!
改行はShift+Enterで!
<div style="padding:16px;background:url(https://stat.ameba.jp/user_images/20231221/19/atelier-plume-net/3c/ea/j/o0650065015379736954.jpg);box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.7);padding:20px;">本文はここに入力してください。改行はShift+Enterで!</div></div>
本文はここに入力してください。
改行はShift+Enterで!
改行はShift+Enterで!
<div style="padding:16px;background:url(https://stat.ameba.jp/user_images/20231221/19/atelier-plume-net/3c/ea/j/o0650065015379736954.jpg);box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.7);border:4px double #E3E2DE;padding:20px;">本文はここに入力してください。改行はShift+Enterで!</div></div>
本文はここに入力してください。
改行はShift+Enterで!
改行はShift+Enterで!
<div style="padding:16px;background:url(https://stat.ameba.jp/user_images/20231221/19/atelier-plume-net/3c/ea/j/o0650065015379736954.jpg);box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.7);border:4px double #e8d5af;padding:20px;">本文はここに入力してください。改行はShift+Enterで!</div></div>
影つき角丸マーブル背景
本文はここに入力してください。
改行はShift+Enterで!
改行はShift+Enterで!
<div style="padding:16px;background:url(https://stat.ameba.jp/user_images/20231221/19/atelier-plume-net/3c/ea/j/o0650065015379736954.jpg);border-radius:10px;box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.7);padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterで!</div></div>
本文はここに入力してください。
改行はShift+Enterで!
改行はShift+Enterで!
<div style="padding:16px;background:url(https://stat.ameba.jp/user_images/20231221/19/atelier-plume-net/3c/ea/j/o0650065015379736954.jpg);border-radius:10px;box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.7);border-radius:5px;border:4px double #E3E2DE;padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterで!</div></div>
本文はここに入力してください。
改行はShift+Enterで!
改行はShift+Enterで!
<div style="padding:16px;background:url(https://stat.ameba.jp/user_images/20231221/19/atelier-plume-net/3c/ea/j/o0650065015379736954.jpg);border-radius:10px;box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);"><div style="background:rgba(255,255,255,0.7);border-radius:5px;border:4px double #e8d5af;padding:20px;border-radius:5px;">本文はここに入力してください。改行はShift+Enterで!</div></div>
LINEの友だち追加で
「アメブロで使えるかわいいマーカー」
をプレゼントしています!
「マーカー」とメッセージを送ってね
ID検索は @570smkow
Amebaブログforビジネス公式パートナー
୨୧ アメブロで使える囲み枠一覧
୨୧ 囲み枠 週間・月間ランキング
୨୧ 囲み枠の便利な情報
୨୧ アメブロ設定ポイント10選
୨୧ Canvaのおすすめ情報