プロパティ名 | 値 | 適用対象 | 継承 |
---|---|---|---|
background-image: | 背景画像 | すべての要素 | なし |
値 | 説明 | |
---|---|---|
背景画像 | url() | 背景に表示する画像ファイルのURLを「( )内に指定し ます。 |
none | 背景画像を表示しません(デフォルト)。 |
ページ全体や文字列、段落などの背景に画像を表示するには、background-imageプロパティで指定します。
背景画像には、画像ファイルのURLまたは、noneを指定します。
画像ファイルのURLは、「url」に続けて「( )」内にダブルクォーテーション「"」または、
シングルクォーテーション「'」で囲んで「url("画像ファイル名")」のように指定します。
背景画像は、背景色と同様に、スタイルを適用する要素が生成するボックス領域の枠線の内側に適用されます。
ただし、body要素に指定した場合は、プラウザの表示領域全体になります。また、table要素に指定した場合は、
表全体に適用されます。background-repeatプロパティで背景画像の並べ方を指定しない場合は、
タイル状に繰り返して表示されます。
外部のcssファイルを読み込んでスタイルシートを利用する場合、画像ファイルのURLは、HTMLファイルからの相対URLではなく、cssファイルからの相対URLで指定します。
サンプルソース
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
<style type="text/css">
<!--
body{background-image:url("背景画像URL")}
h1{width:400px;
background-image:url("背景画像URL");
color:white;
}
p{width:400px;
padding:10px;
border:1px solid;
background-image:url("背景画像URL");
}
-->
</style>
</head>
<body>
<h1>日光東照宮</h1>
<p>
日光東照宮(にっこうとうしょうぐう)は栃木県日光市にある神社。江戸幕府初代将軍徳川家康を神格化した東照大権現を祀る。
日本全国の東照宮の総本社的存在である。正式名称は地名等を冠称しない「東照宮」であるが、他の東照宮との区別のために、
「日光東照宮」と呼ばれることが多い。
</p>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"