＜ナイスバディな body ってなーに＞
<body>本文</body>
ナイスバディの、あのバディ、body （本文、本体）です。ホームページの本文がこれから始まりますよって、ブラウザに教えてくれます。ですから、実は前回書いたタグは、正式な書き方ではなく、正しくは次のように<body></body>で本文をサンドイッチのようにはさみ、その間に本文を書くのが正式な書き方になります。
<html>
<head><title>簡単なページ</title></head>
<body>
さっそく簡単なページを作ってみましょう。
たったこれだけでもホームページやん。
</body>
</html>
これならもう本格的なタグです。(^_^) ブラウザで表示確認しても前回と全く変わりません。
ここで、表示(V)ソースを見てみますと。
と、ちゃんとなっていますよね。
では次に、本文の背景を白以外のバックに変えたり、文字の色を変えたりしてみます。
この時にも body が活躍します。全くもって、ナイスなバディですね。(^_^)
では、復習はこれくらで、今日のメインにまいります。まずはひととおり説明させてください。その後に実践してみます。
（その１）
ブラウザの背景の色を指定する（無指定の場合は白）
<body bgcolor="色">本文</body>
これで本文の背景の色を指定します。bgcolor は background バックグラウンド（背景）の意味を省略したものかな。"色"の部分には
英語でたとえば "white" とか、１６進法の "#ffffff"というふうに指定します。背景を白にしてみたいならば、
<body bgcolor="white">本文</body> とするか、または
<body bgcolor="#ffffff">本文</body>とすればいいわけですね。
１６進法での表し方は、赤・緑・青の光の三原色を英数字で表すことで、表示色を指定しているようです。たとえば、赤の光を少し、緑の光をたくさん、青の光を少しあてた時に出来上がる色を背景に表示しなさい、それを英数字で表している、そんな感じでしょうね。
#の次の二桁が赤、次の二桁が緑、そして次が青の濃さです。
#000000→ならば赤が00、緑が00、青が00、つまり、どの色の光もあたらない状態ですから、背景は真っ黒になります。
#ffffff→ならば三原色全てが均等にあたるので、出来上がった色は白になります。（ ff とは16進法で256番という意味です）
（その２）
ブラウザの本文のテキストの色を指定する（無指定の場合は黒）
<body text="色">本文</body>
これは本文のテキストの色を指定します。このタグにサンドイッチされたテキスト全部が指定された色になります。文字の一部分のみの色を指定する場合は別のタグを用いますので、今回は全部指定で我慢してください。
（その３）
ブラウザの背景に壁紙（画像）を表示させる
<body background="画像ファイル名">本文</body>
画像を扱うのは後にしたいので、今回は説明だけです。本文の背景に画像をおきたいときに、このようにタグを記述します。
画像ファイル名はもちろん英語で、たとえば sortie.gif などのように指定します。ファイル名に日本語は使わないでください。
＜今日の実践＞
さて、今までのまとめをしてみましょう。文はお好みによって変えてください。できるだけ皆さんご本人や周りの人の名前を入れたりすると楽しいかもしれません。下の例では、背景をピンク、文字を青に指定しています。
<html>
<head><title>簡単なページ・パート２</title></head>
<body bgcolor="pink" text="blue">
さっそく簡単なページを作ってみましたぞ。
たったこれだけでもホームページなんやね。
いやー、今日も暑かったよねえ。
ビアガーデンに行きたいぞ。
ほんちの日記
</body>
</html>
タイプが済んだら適当な名前を付けて保存します。今回のは mypage2.htm として保存、ブラウザで開いてみます。
たまには、ネットスケープで開いてみますね。
ちょっとほんわかムードって言うんでしょうか、ピンクだとこんな感じになりますね。
色がお気に召さない方は、ご自由に変更なさってみてください。英語で指定するのが簡単です。
白 white 黒 black 赤 red 黄色 yellow 緑 green その他にも aqua , navy , teal , gray , silver , magenta , maroon , olive , purple などがあります。これらはそのままタグの中で使えますし、さきほどの説明にもありました１６進法を使う方法もあります。
色を決める時点で気を付けたい点がひとつだけあります。背景の色と、本文のテキストの色を同じにすると見づらくなるという事です。
同じ色だと区別がつかなくなりますから。また、色合いが近い色でも同じです。いろいろ試してみてください。
ウェブサイトによっては、わざと背景色と同じ文字色を用いて、文字を隠していることもあるようですが。
試し方は、たとえば、
<body bgcolor="pink" text="blue">の部分の"pink"と"blue"を入れ替えて名前を付けて保存、ブラウザで確認するという段取りです。
ピンクのページだったら、mypage2p.htm としたり、黒いページならばmypage2b.htm という名前で保存すると、後で比較する時に分かり安いかも。では今度は背景を黒にして、文字を白に指定しましょうか。今回は１６進法を用いましょう。
<html>
<head><title>簡単なページ・パート２</title></head>
<body bgcolor="#000000" text="#ffffff">
さっそく簡単なページを作ってみましたぞ。
たったこれだけでもホームページなんやね。
いやー、今日も暑かったよねえ。
ビアガーデンに行きたいぞ。
ほんちの日記
</body>
</html>
変更し終えたら、mypage2b.htmと名前を付けて保存して、ブラウザで開いて確認してみます。
だいぶ雰囲気が違いますよね。大人の雰囲気って感じかな？(^_^)
