Как изменить полосу прокрутки

Как сделать красивую полосу прокрутки на сайте

В этом уроке пойдет речь о том, как изменить цвет полосы прокрутки на вашем сайте, чтобы он подходил по дизайну. По умолчанию полоса прокрутки и квадратики "вверх" "вниз" во всех браузерах голубые с белой рамкой и тенью. Представленный ниже метод работает в IE (проверено до 8 версии) и Опере.

Оформление полосы прокрутки задается стилями, привязать которые к html документу можно разными способами.

Можно вставить код (приводится ниже) в каждую страницу сайта, где Вы хотите видеть красивую полосу прокрутки. Откройте в блокноте или в HTML редакторе ту страницу сайта. на которой вы хотите изменить цвет полосы прокрутки.

Между тэгами <head></head> вставьте следующие строки:

Расшифрую:

1. scrollbar-arrow-color - цвет стрелки.

2. scrollbar-track-color - цвет подложки.

3. scrollbar-face-color - цвет самой полосы.

4. scrollbar-shadow-color: #ffffff;

scrollbar-highlight-color: #ffffff;

цвет разделющей полосы.

5. scrollbar-3dlight-color: #5997CA;

scrollbar-darkshadow-color: #5997CA;

цвет внешних границ

полосы.

Если Вы не знаете как определить цвет в формате #xxxxxx, то воспользуйтесь программой HTML Colors 2000, которая показывает цвет в этом формате в любом месте экрана или возьмите нужный код цвета из таблицы цветов .

Но этот метод задания стилей для полосы прокрутки не очень удобен, представьте, у ваc сотни страниц и в каждую нужно вставить такой код, а если возникнет необходимость его изменить?

Лучше воспользоваться таблицами стилей. Откройте в блокноте новый файл, втавьте в него вышеприведенный код, только без тэгов <style></style> и сохраните его под расширением .css .

В тех страницах, где Вы хотите изменить цвет полосы прокрутки, между тэгами <head></head> вставьте строку привязки таблицы стилей - ссылку на css-файл с кодом (как привязать CSS к HTML ). При необходимости вновь изменить цвета полосы прокрутки в последнем случае вам будет достаточно изменить только файл со стилями.

В Хроме и Файрфоксе такое задание стилей не работает. В Google Chrome, в частности, стили полосы прокрутки задаются в настройках браузера пользователя в файле custom.css, в Windows 7/Vista он находится в C:\Users\ИмяПользователя\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets

Источник: xn--80aj1ak1b.xn--p1ai

Категория: Программное обеспечение

Похожие статьи: