テキストの行間を広げよう
読んでもらえなくなるかも?!
HTML文書を標準のまま書いていくとなんだかとても見難いものに
なってしまいます。
欧文に合わせての行間らしいので、日本語だとどうしても見難く
なってしまうようです。
実際、今読んでいるこのページも行間をとってあります。
では、これが行間がなかったらどうなるのか・・・・
こんな感じ↓になります。
どうでしょうか?見やすいですか?
下のようなタグを<head>〜</head>内に直接記述すれば
変わりますが基本的にスタイルシートを使います。
赤文字の部分を変える事によって、行間が変わります。
| <style type="text/css"> <!-- <p> body, th, td { line-height: 150%; } </p> --> </style> |
ホームページビルダーを使っている方なら、スタイルシートマネージャーから変更する事ができます。
スタイルシートを設定するには、「スタイルシートマネージャーの
表示/非表示」ボタン
をクリックして、スタイルシートマネージャーを開きます。
開いたらスタイルシートマネージャーの追加ボタンをクリックして
スタイルの設定を行います。
ここでは、※
のように、段落タグ<p>〜</p>で囲まれた範囲に
対してスタイルを設定していきます。
「HTMLタグスタイルを設定」で設定してしまうと、ページ全部同じ
設定になるのでいちいちページごとに設定をする手間が省けます。
一部だけ変更する場合は、クラス設定で行ってください。
「HTMLタグスタイルを設定」ダイアログで、「HTMLタグの候補」の
中から「段落 P」を選びます。

次に、矢印の場所「文字のレイアウト」を選択します。
すると、行間というのがあるのでそこに入力します。

行間は、「ピクセル」や「パーセント」などいろいろな単位が使えます。
使いやすいのは、人それぞれでしょうが花毬はパーセントで
設定している事が多いです。
現在のフォントサイズを100%として考えます。
ですから、100%に設定した場合見た目の変化はしません。
つまり200%文字の高さ分の空白が出来るという事です。
150%に設定をすれば、現在の文字高100%+文字高の半分の空白50%が出来る事になります。わかるでしょうか?
あとは、個人の好みもありますし好きに微調整すればいいと思います。