Главная
Блог разработчиков phpBB
 
+ 17 предустановленных модов
+ SEO-оптимизация форума
+ авторизация через соц. сети
+ защита от спама

Как изменить цвет полосы прокрутки с помощью CSS.

Viktor | 24.02.2014 | нет комментариев

Меняем стиль полосы прокрутки на сайте.

Иногда, попадая на какой-то сайт, Вы видите что цвет полосы прокрутки окна браузера меняет свой цвет, причем может измениться цвет как вертикальной, так и горизонтальной полосы прокрутки. Иногда это оправдано и действительно смотрится очень оригинально. Создают такой эффект – с помощью стиля (CSS). Причем можно изменять цвет не только самих полос прокрутки, но элементов оформления находящихся рядом с полосами. На сегодняшний день существуют восемь атрибутов, которыми можно задавать различные параметры прокрутки:

  • scrollbar-3d-light-color – цвет контуров (окантовки) прокрутки
  • scrollbar-arrow-color – цвет стрелочек на полосе вертикальной прокрутки
  • scrollbar-base-color – базовый цвет прокрутки (фон)
  • scrollbar-dark-shadow-color – тень прокрутки (более затемненная)
  • scrollbar-face-color – цвет прокрутки
  • scrollbar-highlight-color – цвет полос, по которым движется прокрутка (фон)
  • scrollbar-shadow-color – тень прокрутки (обычная)
  • scrollbar-track-color – цвет полос, по которым движется прокрутка

Чтобы изменить цвет полосы прокрутки или других элементов, поместите (не обязательно все атрибуты) их в теге <BODY> в html-коде web-страницы, а в качестве значений присвойте шестнадцатеричное значение цвета или его название на английском языке. Например вот таким образом:

Листинг 12.1.

<body style=”scrollbar-3d-light-color: #000000;
scrollbar-arrow-color: #F2F5FF;
scrollbar-base-color: #F2F5FF;
scrollbar-dark-shadow-color: #000000;
scrollbar-face-color: #475059;
scrollbar-highlight-color: #B8C2CC;
scrollbar-shadow-color: #B8C2CC;
scrollbar-track-color: #262D34;”>

На сегодня это всё. Пробуйте и эксперементируйте и у Вас все получится :-) .

Удачи Вам.

АВТОРСКИЕ ПРАВА
Источник: luksweb.ru
При перепечатке ссылка на источник обязательна
Оставить комментарий

Ваш email не будет опубликован. Обязательные поля помечены (обязательно)

Вы можете использовать это HTMLтеги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Форум phpBB, русская поддержка форума phpBB
Рейтинг@Mail.ru 2008 - 2014 © BB3x.ru - русская поддержка форума phpBB