CSS scrollbar-color 속성

정의와 사용법

scrollbar-color 속성은 스크롤바 트랙(배경)과 슬라이더(스크롤바)의 색상을 지정합니다。

예제

요소 스크롤바의 색상을 설정:

div.scroller {
  width: 300px;
  height: 100px;
  overflow-y: scroll;
  scrollbar-color: 핑크 레드;
}

본인이 직접 시도해보세요

CSS 문법

scrollbar-color: auto|color color;

속성 값

값 설명
auto 브라우저가 스크롤바의 색상을 설정합니다. 기본값.
color color 첫 번째 색상은 스크롤바 슬라이더의 색상을 설정하며, 두 번째 색상은 스크롤바 트랙의 색상을 설정합니다。
initial 이 속성을 기본값으로 설정합니다. 참조: initial。
inherit 부모 요소에서 이 속성을 thừa kế합니다. 참조: inherit。

기술 세부 사항

기본값: auto
thừa kế: yes
애니메이션 제작: 지원하지 않습니다. 참조:애니메이션 관련 속성。
버전: CSS 스크롤바 스타일링 모듈 레벨 1
제이스크립트 문법: object.style.scrollbarColor="red blue"

브라우저 지원

표格의 숫자는 이 속성을 최초로 완전히 지원하는 브라우저 버전을 나타냅니다。

크롬 에지 파이어폭스 사파리 오페라
121 121 64 지원하지 않음 107