画像を背景にする

HTMLを使用した記述方法

記述方法

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
</head>
<body background="../img/smp.gif">

</body>
</html>

解説

背景色を指定したときと同じように、「body」タグ内へ記述します。相対パス指定、絶対パス指定どちらでも指定することができます。

また、画像には「GIF」「JPG」「PNG」形式の画像を指定することができます。

ちなみに使用した画像は次のものです。

サンプル画像

表示サンプルを見たい方は以下をクリックして下さい（別窓でサンプルが表示されます）。

サンプルはこちら

ＣＳＳを使用した記述方法

記述方法

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<style type="text/css">
<!--
body { background-image:url("../img/smp.gif"); }
-->
</style>
</head>
<body>

</body>
</html>

解説

スタイルシートを使用した場合も、相対パス/絶対パスにて指定できます。また、画像には「GIF」「JPG」「PNG」形式の画像を指定することができます。ちなみに使用した画像は次のものです。

サンプル画像

表示サンプルを見たい方は以下をクリックして下さい（別窓でサンプルが表示されます）。

サンプルはこちら

相対パス・絶対パス: 覚えていますか？忘れてしまった方は「相対パス・絶対パスとは」に戻って復習しましょう。