サンプル - Microsoft Internet Explorer |
見出しの背景も画像です。段落の背景も画像です。 |
背景に画像を指定するには、background-imageプロパティを使います。
HTMLでも、<body>タグの中にbackground属性をつけて背景に画像を使うことが出来ましたが、このプロパティも前で説明した、background-colorプロパティと同じように、見出しや段落などいろいろな所に画像を張り込むことが出来ます。
値には、まずurlの文字を記入し、その後ろのカッコ内に画像ファイルのアドレスを相対パス(gazou/sky.gif)か絶対パス(http://〜/sky.gif)で指定します。
スタイルシートファイルをつかって、背景画像の設定する場合は、HTMLファイルからではなくてスタイルシートファイルを基準にして、画像のアドレス(URL)を記入します。なお、NNでは、HTMLファイルを基準にしてしまいます。
それと、フォームのテキストエリア(<textarea>)にこのプロパティを指定した場合、Netscape Navigator4.7では画像が表示されないだけではなく、入力欄自体も表示されませんので注意して下さいね。
サンプル - Microsoft Internet Explorer |
見出しの背景も画像です。段落の背景も画像です。 |
<html> <head> <title>サンプル</title> <style type="text/css"> <!-- body { background-image:url(a.gif); } h1 { background-image:url(b.gif); } p { background-image:url(c.gif); } --> </style> </head> <body> <h1>見出しの背景も画像です。</h1> <p>段落の背景も画像です。</p> </body> </html>