文章を強調する方法には
*サイズを大きくする。
*色を変える。
*太字にする
など、ありまして。
また、引用文などについては、『』で囲む以外には、イタリックにしたりするのも一般的です。
以上のように、文章に変化をつける方法は、ご存知だと思います。
「ブログを書く」ところの上部にあるもので全部できますよね。
で、今日は「罫線で囲む」こと文章を強調する方法を。
これはちょっと厄介で、「ブログを書く」編集ページの「HTMLタグを表示」画面から、文章を編集しなくてはいけません。
たとえば・・・
このように普通の罫線で囲む場合。
下の<div ~></div>を、「HTMLタグを表示」を使って罫線枠を挿入したい場所にコピー&ペーストで入れます。
<div style="BORDER-TOP: 1px solid; BORDER-RIGHT: 1px solid; BORDER-BOTTOM: 1px solid; PADDING-BOTTOM: 5px; PADDING-TOP: 5px; PADDING-LEFT: 5px; BORDER-LEFT: 1px solid; PADDING-RIGHT: 5px">○○○ここに文章を入れてね!</div>
これを、線の色を変えたり、罫線のスタイルを変えたい、ということであれば
<div style="BORDER-TOP: #cc0000 3px double; BORDER-RIGHT: #cc0000 3px double; BORDER-BOTTOM: #cc0000 3px double; PADDING-BOTTOM: 5px; PADDING-TOP: 5px; PADDING-LEFT: 5px; BORDER-LEFT: #cc0000 3px double; PADDING-RIGHT: 5px">○○○ここに文章を入れてね!</div>
とか
<div style="BORDER-TOP: #006600 2px dashed; BORDER-RIGHT: #006600 2px dashed; BORDER-BOTTOM: #006600 2px dashed; PADDING-BOTTOM: 5px; PADDING-TOP: 5px; PADDING-LEFT: 5px; BORDER-LEFT: #006600 2px dashed; PADDING-RIGHT: 5px">○○○ここに文章を入れてね!</div>
とか
<div style="BORDER-TOP: #ff9900 2px dotted; BORDER-RIGHT: #ff9900 2px dotted; BORDER-BOTTOM: #ff9900 2px dotted; PADDING-BOTTOM: 5px; PADDING-TOP: 5px; PADDING-LEFT: 5px; BORDER-LEFT: #ff9900 2px dotted; PADDING-RIGHT: 5px">○○○ここに文章を入れてね!</div>
とかね。
そして、文章を入れる際には、「タグの非表示」画面で、普通に罫線の中身に文章を入れてOKです。もちろん、そのままHTMLタグの中に入れてもOKです。
ちなみに、最後の罫線枠を参考にHTMLタグの説明をしてみます。
「BORDER」でそれぞれの線の、「PADDING」でそれぞれの余白の指定をしているのです。
なので、赤字の箇所は、書き換えが可能です
習うより慣れ
チャレンジしてみてください