CSS background-attachment 짤로 한번에 이해하기

CSS background-attachment

background-attachment는 배경 이미지의 스크롤 여부를 설정하는 요소이다.

 

기본값: scroll

 

문법

background-attachment: scroll | fixed | local | initial | inherit
fixed : 움직이지 않음

         브라우저의 보이는 영역에서 본인 위치에 붙어있다고 생각하면 쉽다
         (=스크롤 내려도 배경에 고정되어 있음)
scroll : 내용 스크롤시 배경이미지 스크롤X. 선택한 요소와 같이 움직임.

         (=요소 안에서 본인 위치에 고정)
local : 내용과 같이 배경이미지 스크롤 됨. 선택한 요소와 같이 움직임.
initial : 기본값으로 설정
inherit : 부모 요소의 속성값 상속

ex)