久々にブログを書こうとしてもなかなかうまく書けないので・・・笑
色々と参考になって楽しいですね♡
いろんな方のブログを参考にさせて頂いた際に思ったことは
メニューのご案内や告知の内容がどこにあるのかすぐに分かるブログが
とても見やすいなって思いました
![音譜](https://stat.ameba.jp/blog/ucs/img/char/char2/038.gif)
初めてブログに来てくださったお客様にも解りやすいブログ作りのために!
読んでほしい文章、メニューのお知らせ、ご案内などは工夫して目立たせましょう♡
目立たせる方法としては文字の大きさを変えたり、色を変えたりするだけでも
変わってきます
![ドキドキ](https://stat.ameba.jp/blog/ucs/img/char/char2/031.gif)
今回は文字を線で囲む囲み枠を作る方法を紹介しますね♡
![](https://stat.ameba.jp/user_images/20151123/17/chuxxxgirl/11/7b/j/o0724047913492019281.jpg?caw=800)
検索すれば沢山出てくるのですが、ピンクをメインにした可愛い囲み枠を調べました♡
それぞれの枠の下に表示されているタグをそのままコピペして使って下さいね♡
可愛い囲み枠
*点線囲み枠
<div style="background:#f7f7f7; padding:10px; border-radius: 10px; border: 3px dotted #ffb6c1;">ここに本文を記入</div>
*2重線の囲み枠
<div style=" padding:10px; border:3px double #ff99cc;"> ここに本文を記入 </div>
*背景色つき囲み枠
<div style="background:#fff8f5; padding:10px; border: 3px solid #ffb6c1;">ここに本文を記入</div>
見出し付き囲み枠
*見出し付きの囲み枠*
見出し付きの囲み枠です全ての囲み枠は改行しても使えます♡
<div style="background:#ff8cc6; border:1px solid #ff8cc6 padding-left:10px; font-size:1.16em;"><font style="color:#ffffff; font-weight:bold;">・ここにタイトルを記入・</font></div><div style="border:1px solid #ff8cc6; padding:10px; font-size:1em;">ここに本文を記入</div>
また可愛い囲み枠を発見したら追記していきますね
![ラブラブ](https://stat.ameba.jp/blog/ucs/img/char/char2/035.gif)