文字を入力する
区切り線
操作説明 ムービー 操作練習 クイズ
  段落と段落の間に区切り線(水平線)を挿入することで、文章にメリハリをつけることができます。
     
  1.
段落がいくつか含まれた文章を用意します。区切り線を挿入したい前の段落の最後、もしくは区切り線を挿入した後ろの段落の先頭、どちらかにカーソルをあわせます。
     
  2.
挿入バー(メニューバーの下にあるツールバー)の『一般』となっている部分をクリックします。
     
  3.
プロダウンメニューから『HTML』を選びます。
     
  4.
挿入バーに表示されるボタンの種類が変わりました。この中から『区切り線』ボタンをクリックします。
     
  5.
段落と段落の間に区切り線が挿入されました。
     
  6.
この区切り線は形を変えることができます。挿入した区切り線をクリックして選択してください。プロパティインスペクタの内容が区切り線のプロパティ設定に変わっています。ここではサイズを変更してみることにしましょう。
     
  7.
区切り線の幅を50%、高さを10にしてみます。幅の入力枠の横に『ピクセル』『%』を選ぶプルダウンメニューがあります。『ピクセル』は絶対値(入力した数字のピクセル分の幅)に、『%』はブラウザのウィンドウサイズの幅に対しての相対値となります。今回は50%に設定したいので、入力欄に「50」、プルダウンメニューから『%』を選びます。高さは絶対値のみなので、入力欄に「10」と入力してください。
※デフォルト(プロパティ未設定時)ではウィンドウサイズに対して100%の幅となります。また、区切り線は指定が無い限り中央揃えとなります。
     
  8.
区切り線の形が変わりました。
 
区切り線の扱い
区切り線は、それ自身で1段落として扱われます。段落の途中に区切り線を挿入すると、その段落は区切り線を挟んで2つの段落に分かれてしまいます。

  左図のように、区切り線も含めテキスト箇条書きを適用させると、区切り線が一段落として扱われていることがわかります。
     
 
段落の途中に区切り線を挿入すると   挿入した段落は、区切り線を境に2つの段落に分かれてしまいます。


区切り線のプロパティ
プロパティを設定する事で、区切り線を様々に修正する事が出来ます。
ドキュメントウィンドウで区切り線を選択すると、プロパティインスペクタが区切り線のプロパティに変化します。



区切り線の幅・高さ
[幅] および [高さ] では、区切り線の幅と高さを、ピクセル単位またはページサイズに対する割合 (%) で指定します。

 
    プロパティの幅・高さを設定すると、様々な区切り線を作成する事が出来ます。
※幅のパーセントを選択すると、ウィンドウサイズに対して指定した%幅の区切り線となります。ウィンドウサイズを変更すると、それに伴い区切り線の幅も変化します。

区切り線の行揃え
[行揃え] では、区切り線の整列を指定します ([指定なし]、[左]、[中央]、または [右] から選択)。この設定は、区切り線の幅がブラウザウィンドウの幅より小さい場合に適用されます。

 
    プロパティの行揃えを設定すると、区切り線を指定の位置に配置する事ができます。
※区切り線はデフォルト(未設定)では中央揃えなので、行揃え:中央は基本的には意味がありません。また、行揃えは区切り線がブラウザウィンドウ幅より小さい場合のみ有効です。

区切り線のシェーディング
[シェーディング] では、区切り線にシェーディングを付けるかどうかを指定します。このオプションをオフにすると、区切り線は単色で表示されます。

 
    プロパティのシェーディングを設定すると、区切り線の装飾が可能です。
※デフォルトでは、[シェーディング:あり] となっています。シェーディングを外す場合はプロパティインスペクタの[シェーディング]チェックボックスのチェックを外してください。
  次へ