Properties

Properties

Editing
  • account_tree
  • bug_report

background-attachment

선택자 요소에 배경으로 설정된 이미지를 스크롤 또는 고정 여부를 설정한다.

설명

'scroll'로 설정된 경우에는 콘텐츠와 함께 배경 이미지도 함께 스크롤 된다. 'fixed'로 설정된 경우에는 배경 이미지는 그대로 고정되고 콘텐츠만 스크롤 된다. 이와 같은 설정은 보통은 body에게 적용되는 경우이며 일반 요소에게 적용하는 경우는 다르다.

일반 요소에게 콘텐츠가 스크롤되도록 설정이 되어 있다면 적용된 배경 이미지는 기본적으로 고정된다. 하위 콘텐츠와 함께 적용된 배경 이미지가 스크롤 되기를 원한다면 local 값을 설정해야 한다.

만약에 하위 요소들에게 배경 이미지가 설정되어 있고 각각 fixed로 고정되어 있다면 해당 하위 요소의 배경 이미지는 스크롤 되는 상위 컨테이너에게 고정되어 있으므로 스크롤시 독특한 효과가 나타나기도 한다.

사용 가능한 값 타입

〈attachment〉

배경 이미지가 지정된 경우 뷰포트로 부터 고정(fixed), 스크롤(scroll) 또는 콘텐츠와 함께 스크롤(local)할지를 나타내는 타입이다. 다중 배경인 경우 콤마로 구분된 연속된 값을 가질 수 있다.

  • scroll | fixed | local
    CSS Backgrounds and Borders Module Level 3

사용되는 키워드

  • fixed

    뷰포트에 고정을 시킨다.

  • local

    요소에게 적용된 배경 이미지가 요소의 콘텐츠와 함께 스크롤 된다.

  • scroll

    기본 값이며 요소와 함께 배경을 스크롤한다.

다음은 필요에 따라 일부 값을 설명하므로 표시되지 않는 값은 값 유형을 참조하라.

  • scrollCSS1

    기본 값이며 콘텐츠와 함께 배경을 스크롤 한다.

  • fixedCSS1

    뷰포트에 고정을 시킨다.

    배경 이미지가 스크롤되지 않도록 한다.

  • localCSS1

    body가 아닌 요소에게 배경 이미지를 적용시 스크롤 영역이 생기더라도 고정된다. 그러나 local을 지정하면 콘텐츠와 함께 스크롤된다.

    요소에게 배경을 적용시 기본적으로 스크롤되지 않으나 local을 적용하면 콘텐츠와 함께 스크롤된다.

  • initialCSS3

    CSS 기본 값으로 설정한다.

구문

  • background-attachment scroll | fixed | local;CSS1

    scroll, fixed, local, initial 상수 값 중에서 선택이 가능하다.

  • object.style.backgroundAttachment="fixed";CSS1

    자바스크립트 형식

버전 명세

Modules
Module NameStatusSummary

Last review date:

지원 웹브라우저