ＨＴＭＬ ワンポイント ページの整形 |
ブラウザの幅いっぱいに文字が並ぶと息が詰まりそうで、読みづらいものです。そこでブラウザの左右に隙間を作って圧迫感を少なくしてみましょう。
また、普通の状態では、行がほとんどくっついて読みづらいので、行の間隔を少しあけてみます。
この画面は下記の設定によって書いています。数値をいろいろ変えて効果を試し、あなたのお気に入りの設定を作ってください。
bodyタグに style属性をつけて指定します。
| <body style="margin-left:4em; margin-right:1em; line-height:140%; background-color:ffffcc"> |
本文を書いたあとは bodyの終了タグをつけます。
| </body> |
margin-left は左の余白、margin-right は右の余白で、文字数で指定します。（ em はアルファベットのＭの幅という意味だそうです ）
line-height は１行の高さで、％で表します
background-color は背景色を指定します。不必要(白のまま)のときは書く必要はありません。文字が読める範囲で（あまり濃くしないで）色付けすると良いでしょう。
画面の色は使用しているディスプレイの特性や、個人の好みで輝度や色合いを調節している場合が多いので、百台百様です。微妙な色合いを使って凝った画面を作っても、残念ながら他の人にどう見えているか分かりません。普段使っているコンピュータとは別のコンピュータ（ディスプレイ）で自分の設定がどう見えるか、一度試してください。