背景画像を指定する

background-image: url(URL)

background-image プロパティは、背景の画像を指定します。
背景色の場合と同様に、ここで指定した画像はボックスのマージン
(常に透明)には適用されません。環境によっては、背景画像が
表示されない場合も有りますので、背景色も同時に指定しておきましょう。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<META http-equiv="Content-Style-Type" content="text/css">
<title>CSS覚書</title>
<style type="text/css">
<!--
body {
margin: 2em;
color: #ffffff;
background-color: #ff3300;
background-image: url(http://www5b.biglobe.ne.jp/~donbey/BCG_074.GIF)
}
h1 {
text-align:center;
color: #ffffff;
background-color: #000000;
background-image: url(http://www5b.biglobe.ne.jp/~donbey/BCG_168.GIF)
}
p {
padding: 1em;
color: #000000;
background-color: #ffcc00;
background-image: url(http://www5b.biglobe.ne.jp/~donbey/071.gif)
}
div {
padding: 1em;
color: #000000;
background-color: #ffffff;
background-image: url(http://www5b.biglobe.ne.jp/~donbey/BCG_069.GIF)
}
table, input {
color: #ffffff;
background-color: #ff3300;
background-image: url(http://www5b.biglobe.ne.jp/~donbey/BCG_074.GIF)
}
caption, select {
color: #ffffff;
background-color: #333399;
background-image: url(http://www5b.biglobe.ne.jp/~donbey/BCG_073.GIF)
}
textarea {
color: #ffffff;
background-color: #339933;
background-image: url(http://www5b.biglobe.ne.jp/~donbey/BCG_146.GIF)
}
-->
</style>
</herd>
<body>
<h1>ｈ1要素・背景色を指定する</h1>
<p>
スタイルシートを使用すると、様々な要素の<br>
背景色を自由に設定することが出来ます。
</p>

<div>
<table border="2" cellpadding="8">
<caption>table要素</caption>
<tr><th>ヘッダセル</th><th>ヘッダセル</th><th>ヘッダセル</th></tr>
<tr><td>データセル</td><td>データセル</td><td>データセル</td></tr>
</table>
<p>
<textarea rows="4" cols="50">textarea要素</textarea>
</p>
<p>
<input type="text" value="input要素">
<input type="checkbox" name="chk" checked>
<input type="checkbox" name="chk">
<input type="radio" name="rdo" checked>
<input type="radio" name="rdo">
<select>
<option>select要素</option>
<option>option要素</option>
</select>
<input type="button" value="button">
</p>
</div>
</body>
</html>