【背景固定の方法】 <HEAD> </HEAD> の間に、 <STYLE type="text/css"> <!-- body{ background-image : url(photo/cosmos.jpg); ←※1 background-position:0% 100%; ←※2 background-repeat:no-repeat; ←※3 background-attachment : fixed; ←※4 } --> </STYLE> と記述します。 ※1)緑字のところに背景画像の画像名(または画像へのアドレス)を書きます。 上記の場合、「photo」というフォルダに入っている「cosmos.jpg」という画像を表示させるようになっています。 ※2)画像の位置を記述します。 この例だと左下に固定になります。他にも中央に固定(50% 50%)、右下に固定(100% 100%)などをすることが出来ます。またpx(ピクセル)での固定も可能です。 ※3)画像の並び方を記述します。 この例の場合、画像を繰り返さない設定になってます。 横方向にのみ繰り返したい場合はrepeat-x、縦方向にのみ繰り返したい場合はrepeat-y、縦横に繰り返したい場合はrepeatと記述します。 ※4)この記述があることで、スクロールしても画像の位置が変わりません。 |