あなたのブログの個人秘書 あつみゆかりです。
※過去の記事を再アップしています。
告知記事や記事の下のお知らせなど
囲み枠を使うことが多いですよね。
タグ編集をしなくても
出来ている枠をそのままコピーして
使うことも出来ます。
(行を増やしたい時は、
Ｓｈｉｆｔ＋Ｅｎｔｅｒ
で改行してくださいね。)
けど、気に入った枠を自由に作れるように、
タグ編集は出来た方がいいかなと思います。
基本の枠の作り方を載せています。
囲み枠の作り方
囲み枠を作りたい時は投稿エディタをHTML表示にして（もしくはタグ編集に切り替えて
<div style="border:2px dotted #CCCCCC; padding:10px;"> と </div> |
で文章を囲みます。
グレーの破線の枠ができます。
こんな感じです。
border:2px dotted #CCCCCC; は
線の太さが2pxで、破線、線の色が#CCCCCC（グレー）
padding:10px; は枠と文章との余白という意味です。
枠内に色をつける
<div style="border:2px dotted #CCCCCC; padding:10px; background-color:#F2F2F2;"> |
のように background-color:#F2F2F2;を付け加えると、
枠の内部に色を付けることができます。
こんな感じです。
グレーの破線枠で枠内もグレーです。
線の種類
- solid （実線）
- dotted （破線）
- dashed （点線）
- double （二重線、3px以上）
などです。
私が他によく使う枠はやっぱりピンク
<div style="border:2px solid #ffcccc; padding:10px;"> ピンクの実線の枠
</div>
<div style="border:2px solid #99cccc; padding:10px;"> 水色の実線の枠
</div>
<br /><div style="border:2px double #660000; padding:10px;"> 茶色の二重線の枠
</div>
色と線の種類を変更するだけなので、意外と簡単です。
よく使うものを作っておいてコピーして使うのが簡単かも。
＜事務サポート導入をご検討中の方＞
↓↓↓
＜リモート秘書の仕事に興味のある方＞
在宅事務でライフスタイルに合わせた働き方
↓↓↓
ご提供中のメニュー
◇ブログSNSサポート・事務代行・秘書アシスタントサービス
◇マージパージ（アメブロフォロー整理）
◇オンラインアシスタント講座
◇ブログSNSレッスン＆出張サポート
◇オンラインアシスタント相談
