W3G

background-attachementプロパティの値

scroll

背景画像を固定しない（視点を移動すると背景画像も一緒に動く）

fixed

背景画像を表示域に対して固定する（視点を移動させても背景画像は動かない）

background-attachmentプロパティは背景画像を表示する background-imageプロパティとセットで使います。背景画像の設定がなければ、指定しても効果はありません。

background-attachmentプロパティの実装状況

IE

◯：Internet Explorer 6 では body要素以外に指定されていると表示域に対して固定されるのではなく、適用した要素に対して固定される不具合有り

Firefox

◯

Opera

◯

Chrome

◯

Safari

◯

iOS

◯

Android

◯

サンプル

body.fixed {
background-image : url(image.jpg) ;
background-repeat : repeat-y ;
background-attachment : fixed ;
}
body.scroll {
background-image : url(image.jpg) ;
background-repeat : repeat-y ;
background-attachment : scroll ;
}

この例では2つの文書をインラインフレームで埋め込み、それらの body要素をセレクタに一つは背景画像を固定したもの（fixed）、もう一つは固定していないもの（scroll）を用意しました。文字の読みやすさなどを見比べてください。

また、背景画像の設定でつまづくことの多い点として、表示域全体の中に大きな1枚の画像を背景画像としてスクロールしても同じ部分に表示させたいという場合には、background-attachmentプロパティを使うのではなく、"background-repeat : no-repeat ;" を指定した上で、background-positionプロパティにパーセンテージ値（%）、または "left | right | center | top | bottom" のいずれかのキーワードを指定するようにします。これによりスクロールしても背景画像の表示域内での位置は常に同じ部分に表示することができます。