CSSで背景画像の固定する。 | 電脳備忘録

本記事のソースコードの利用によって生じた損害について、当方は一切の責任を負いません。ご自身の判断と責任のもとで参照・ご利用ください。

この記事は最終更新から2年以上経過しています。

ちょいちょい忘れてしまうので、この際忘れてもいいように備忘録として残しておくことにします。

画面スクロール時に背景画像の位置を固定するか否かを設定するにはbackground-attachmentプロパティを指定する。固定する場合は「fixed」、スクロールする場合は「scroll」を指定する。背景画像を固定する場合

#side_wrapper.index_layout {
background: url(../image/backgroundImg.gif) #FEFEFE repeat;
background-attachment: fixed;
}

画面スクロールに背景画像をあわせる場合

#side_wrapper.index_layout {
background: url(../image/backgroundImg.gif) #FEFEFE repeat;
background-attachment: scroll;
}

参照：スタイルシートリファレンス「background-attachment」