Установка
Вставляем данный код в Таблицу стилей (CSS)
::-webkit-scrollbar-button {
background-image:url('');
background-repeat:no-repeat;
width:5px;
height:0px
}
::-webkit-scrollbar-track {
background-color:#ecedee
}
::-webkit-scrollbar-thumb {
-webkit-border-radius: 0px;
border-radius: 0px;
background-color:#6dc0c8;
}
::-webkit-scrollbar-thumb:hover{
background-color:#56999f;
}
::-webkit-resizer{
background-image:url('');
background-repeat:no-repeat;
width:4px;
height:0px
}
::-webkit-scrollbar{
width: 4px;
}
Установка на этом завершена. Теперь разберем, какая строка за что отвечает.
Цвет дорожки, по которой двигается бегунок прокрутки.
Меняем ecedee на свой цвет.
::-webkit-scrollbar-track {
background-color:#ecedee
}
Цвет бегунка полосы, а так же его закругление.
Меняем 6dc0c8 на свой цвет.
Меняем значение border-radius для закругления.
::-webkit-scrollbar-thumb {
-webkit-border-radius: 0px;
border-radius: 0px;
background-color:#6dc0c8;
}
Цвет бегунка при наведении на него курсора.
Меняем 56999f на свой цвет.
::-webkit-scrollbar-thumb {
-webkit-border-radius: 0px;
border-radius: 0px;
background-color:#6dc0c8;
}
Основная ширина полосы прокрутки.
Меняем значение width
::-webkit-scrollbar{
width: 4px;
}