background-attachmentを使ってパララックス風のサイトを作成する
cssの「background-attachment」を使う事で画面をスクロールする際、指定した要素の背景画像をその位置に固定する事が出来、パララックス風のサイトに簡単に出来ます。
例
記述としては背景画像を固定したい要素に
を記述するだけですが、
background関連のプロパティはショートハンドでまとめて書くようにしたいので、ショートハンドで覚えましょう。
ショートハンドの場合
cssの「background-attachment」を使う事で画面をスクロールする際、指定した要素の背景画像をその位置に固定する事が出来、パララックス風のサイトに簡単に出来ます。
例
記述としては背景画像を固定したい要素に
を記述するだけですが、
background関連のプロパティはショートハンドでまとめて書くようにしたいので、ショートハンドで覚えましょう。
ショートハンドの場合