Properties

Properties

Editing
  • account_tree
  • bug_report

scroll-behavior

스크롤이 가능한 컨테이너 내에서 링크를 클릭할 때 스크롤 위치에 부드럽게 이동할지에 대한 여부를 지정한다.

설명

scroll-behavior 속성은 유저 에이전트(user agent) 별로 지원 여부 또는 옵션 지원 여부에 따라 작동하지 않을 수도 있다. W3C 모듈 스펙에 따르면 유저 에이전트(user agent)가 이 속성을 무시할 수 있다고 정의했다.

크롬 웹브라우저는 일부 버전에서 옵션으로 채택되어 있어 활성화하지 않으면 작동하지 않는다. 확인을 위해서는 다음의 URL을 크롬 웹브라우저에서 호출한다.
chrome://flags/#smooth-scrolling

사용 가능한 값 타입

<'scroll-behavior'>

DEVDIC-Specified Data Types

scroll-behavior 속성에 사용되는 타입이다.

  • CSS Overflow Module Level 3
    auto | smooth

사용되는 키워드

  • auto

    스크롤 상자는 즉시 스크롤된다.

  • smooth

    스크롤 상자는 UA가 정의한 시간 동안 UA가 정의한 애니메이션 방식으로 부드러운 스크롤을 지원한다.

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

  • CSS Overflow Module Level 3

    스크롤 상자는 즉시 스크롤된다.

  • 스크롤 상자는 UA가 정의한 시간 동안 UA가 정의한 애니메이션 방식으로 부드러운 스크롤을 지원한다.

구문

  • scroll-behavior: smooth;
    CSS Overflow Module Level 3

테스트 도구

화면 스크롤 이동에 대한 방법 테스트

버전 명세

Modules
Module NameStatusSummary
CSS Overflow Module Level 3초안 작업

Last review date: 2022-10-20

지원 웹브라우저