長いブログは目次を作って囲み線でまとめてみた！

ブログの小見出しがたくさんある場合は目次を作ってきれいに配置するといいです。
 

囲み線を作る

１）囲み線（通常線） 


<div  style="border-style: solid ; border-width:1px; ;padding: 1px 1px 1px 1px;">テスト</div>

テスト

囲み線を利用して目次を作る

２）囲み線（タイトル付）


<fieldset><legend>目次</legend><div  style="border-width:">テスト</div></fieldset>

目次

テスト

囲み線の横幅を調整する

３）囲み線（アレンジ：幅を変更）


<div  style="border-style: solid ; border-width:1px; ;padding: 1px 1px 1px1px;width:250px;">テスト</div>

250pxにはサイズを入れて横幅を調整してください。

テスト

囲み線に影を付けてカッコよくする

４）囲み線（アレンジ：影をつける追加）


<div  style="border-style: solid ; border-width:1px; ;padding: 1px 1px 1px 1px; width: 250px; box-shadow:5px 5px 5px #AAA;">テスト</div>

テスト

囲み線の使い方

 
１）　記事を書くページの右上にあるHTMLタグ編集からHTMLを表示させて、囲み線を挿入したい箇所へ挿入する。


２）　挿入したら、再度　HTMLタグ編集を押して元の画面に戻り、囲み線の中に文字を入力する。そのままEnterで段落を変えることもできます。

 
※このページは短かったので目次を利用していません。こちらが見本です。