Свойства полоса прокрутки в CSS

WTBG

Старейшина
Репутация
0 / 98
Свойства полоса прокрутки

Данные свойства задают стиль полосы прокрутки. Их можно применять к таких элементов как: BODY, TEXTAREA, IFRAME и другим, которые имеют полосу прокрутки (корме SELECT).


scrollbar-3dlight-color

Устанавливает цвет верха и левой части ползунка и кнопок со стрелками на полосе прокрутки.

Значение:
  • любое соответствующее стандарту значение цвета.
  • inherit - применяется значение родительского элемента.
Код:
body {scrollbar-3dlight-color:green;}


scrollbar-arrow-color

Устанавливает цвет стрелок на кнопке со стрелками.

Значение:
  • любое соответствующее стандарту значение цвета.
  • inherit - применяется значение родительского элемента.
Код:
 body {scrollbar-arrow-color: red;}


scrollbar-base-color

Устанавливает цвет основных элементов ползунка: ползунка, кнопок со стрелками, дорожки для ползунка, если не определены параметры в scrollbar-face-color.

Значение:
  • любое соответствующее стандарту значение цвета.
  • inherit - применяется значение родительского элемента.
Код:
body {scrollbar-base-color: green;}


scrollbar-darkshadow-color

Устанавливает цвет тени для ползунка и кнопок со стрелками.

Значение:
  • любое соответствующее стандарту значение цвета.
  • inherit - применяется значение родительского элемента.
Код:
 body {scrollbar-darkshadow-color: red;}


scrollbar-face-color

Устанавливает цвет ползунка и кнопок со стрелками. Также, если вы не задали параметр SCROLLBAR-TRACK-COLOR, у вас изменится цвет дорожки.

Значение:
  • любое соответствующее стандарту значение цвета.
  • inherit - применяется значение родительского элемента.
Код:
body {scrollbar-face-color: green;}


scrollbar-highlight-color

Устанавливает цвет подсветки, создающий эффект объёмности. Это цвет, который окаймляет освещённую часть кнопочки. Когда кнопка не нажата, то цвет заливает левый верхний угол и стороны между ним, когда нажата - нижний правый угол.

Значение:
  • любое соответствующее стандарту значение цвета.
  • inherit - применяется значение родительского элемента.
Код:
body {scrollbar-highlight-color: green;}


scrollbar-shadow-color

Схоже с scrollbar-darkshadow-color.

Значение:
  • любое соответствующее стандарту значение цвета.
  • inherit - применяется значение родительского элемента.
Код:
 body {scrollbar-shadow-color: green;}


scrollbar-track-color

Устанавливает цвет дорожки для ползунка.

Значение:
  • любое соответствующее стандарту значение цвета.
  • inherit - применяется значение родительского элемента.
Код:
body {scrollbar-track-color: aqua;}


 
Сверху