background-attachmentの使い方
background-attachmentは、画面をスクロールしたときに、
背景もスクロールさせるかを設定するときに使います。
background-attachmentプロパティの値の設定方法
| fixed | 画面がスクロールされている時は共にスクロールされ、コンテンツがスクロールされた時は背景が固定される |
| scroll | 画面がスクロールされている時は固定され、コンテンツがスクロールされた時も背景は固定される |
| local | 画面がスクロールされている時は固定され、コンテンツがスクロールされた時は、背景も共にスクロールされる |
表だけではわかりづらいと思うので、以下のデモをご覧ください。
See the Pen wvWKgyy by ryu (@ryu-no-sss) on CodePen.
fixed
『fixd』の使用例
background-attachment: fixed;
scroll
『scroll』の使用例
background-attachment: scroll;
local
『local』の使用例
background-attachment: local;
まとめ
background-attachmentの値である『fixed』『scroll』『local』の違いについては、
デモを見ていただければ、わかりやすいと思います。
それでは、最後まで読んでいただきありがとうございました。
タグ
