フリー素材を背景画像として固定表示する方法
ページの背景画像を固定表示する場合は、下記のようなタグをスタイルシートに記述します。
[ 例 ]
body {
font: 13px/1.6 Verdana, Geneva, sans-serif;
color: #666;
background: #F6E6E7 url(images/body_bk.jpg) no-repeat left;
}
bodyの中に記述すると、ページ全体の装飾の命令が実行できます。
- repeatは、背景に画像を敷き詰めるか否か。repeat-yは縦に画像を繰り返し表示する。repeat-xは横に画像を繰り返し表示する。no-repeatは、画像を1枚だけ表示する。repeatは、ページの背景全体に画像を敷き詰める。
- leftは左寄せ、rightは右寄せ、centerはページの中央、bottomはページの下部、topは、ページの上部。
- urlは、画像ファイルのある場所を示します。
ページをスクロールしても背景画像が固定されるように命令する場合には、
body {
font: 13px/1.6 Verdana, Geneva, sans-serif;
color: #666;
background: #F6E6E7 url(images/body_bk.jpg) repeat-y fixed left;
}
fixedは、ページをスクロールしても、背景画像の表示位置を常に同じ場所に固定します。scrollは、ページをスクロールした際に背景画像に指定した画像もページのスクロールと同様にスクロールさせます。特別なにも記述しない場合は、画像はスクロールするようになります。



