LESSON-7

背景の色と画像

今回は、画面の背景に、色や画像を指定してみるなり。
では、まず、 背景の色を指定してみるなり。

背景色の指定は、 < BODY > タグの中に、 BGCOLOR="#色番号" を入れるなり。
終タグは、 < /BODY > のままで、いいなり。

色番号の見本は、 こちら

では、 背景色を薄い水色(#CCFFFF)に指定する なり。

< BODY _ BGCOLOR="#CCFFFF" >
_____ (本文省略)
< /BODY >


上書き保存してから、 アイコンをダブルクリックして見てみる なり。

このように表示


次は、 背景に画像を入れるなり。
背景には、色と画像と、同時には、指定できないなり。
どっちか、好きな方を、していするなりよ。
(もちろん、どっちも指定しなくても、いいなり。)

背景画像の指定は、 < BODY > タグの中に、 BACKGROUND="画像ファイル名" を入れるなり。
終タグは、 < /BODY > のままで、いいなり。

「 画像ファイル名 」 のところには、画像のファイルの名前をいれるんだけど、
WWWページ(俗にいうホームページ)で、使える画像ファイルのタイプは、 GIF( 〜.gif) か、 JPEG(〜.jpeg) なり。
その他は、だめなり。
ここでは、GIFを使ってみるなり。

ま、とりあえず、しらちが用意した下の画像を使うなり。

お花の画像 hana_p.gif
お花の画像

この画像をみなさんのパソに取り込む方法。
画像の上で、右クリックして、「画像を名前をつけて保存」にするなり。
これは、しらちの使ってるネットスケープでの、やり方なんで、 その他の人は、それなりに、やってみるなり。
だいたい、同じようなやり方のはずなり。

保存場所は、 「index.html」ファイル がはいってるのと、同じフォルダに入れるなり。
「www」フォルダ ってことなりね。
自分で画像を用意した場合も、このフォルダに入れるなりよ。

背景画像は、縦横に繰り返して表示されるなり。
だから、ちいさな画像を用意すれば、充分なりね。

では、 お花の画像(hana_p.gif)を背景に指定するなり。

< BODY _ BACKGROUND="hana_p.gif" >
_____ (本文省略)
< /BODY >


上書き保存してから、 アイコンをダブルクリックして見てみる なり。

このように表示


うーん。ちと、文字が見にくいかも。
文字の色を #FF00FFから #006600に、変えてみるなり。

このように表示


うん。だいぶ、見やすくなったね。
ま、こんなカンジで、いろいろ修正しながら、ページをデザインしていきましょう。

では、次回は、画像を入れるので、用意しておくなりよ。
グッドラック!

LESSON-8へ進むなり

もどるなり