背景画像関係の準備
(1)背景画像保存用フォルダ
ホームフォルダに【index.htm】用の画像・音楽ファイルなどを保存する【top】フォルダを作成する。
(2)背景画像ファイル
背景画像(壁紙)のサイトを2ヶ所紹介します。好きな画像を選んでください。
使用条件の記述があるので注意してください。
(2-1)Paper Company
右のタイル状GIF画像【c92.gif】を【top】フォルダに保存しました。
画像のファイル形式、大きさなどが変わっても使い方は同じです。
(2-2)0-MATERIAL
右のタイル状GIF画像【w_br04r.gif】を【top】フォルダに保存しました。
1.【index.htm】に背景画像を設定する
スタイルシートの次の部分を青地部のとおり書き換える。
書き換え前
body{font-size:22pt;color:navy;background-color:lavender}
書き換え後
body{font-size:22pt;color:navy;background-image:url(top/c92.gif)}
2.【hana1.htm】に背景画像を設定する
bodyタグを次の青地部のとおり書き換える。
書き換え前
body{font-size:22pt;color:navy;background-color:lavender}
書き換え後
body{font-size:22pt;color:navy;background-image:url(../top/w_rb04r.gif)}
index.htm完成サンプル hana1.htm完成サンプル
スタイルシート解説参照 background-image:url(../top/c92.gif)
タグ解説url参照 url(../top/c92.gif):urlの解説参照
|