CSS для стандартной полосы прокрутки Chrome

Question

Мне нужно настроить только ширину полос прокрутки браузера Chrome с помощью CSS, но нужно все остальное (например, эффект наведения, цвет при наведении, цвет дорожки полосы прокрутки, цвет кнопки прокрутки и т. Д., Цвет полосы прокрутки при нажатии и т. Д.) как есть.

Как я могу это сделать? Я знаю, что мы можем изменить ширину полосы прокрутки, используя следующую CSS:

::-webkit-scrollbar {
    width: 12px;
}

Answer 1

Вы можете сделать это

::-webkit-scrollbar для всей полосы прокрутки

handle - это полоса прокрутки, где вы можете добавить такой фон и применить также pseudo elements или перетаскиваемую прокруткуhandle.

track - это progress bar полосы прокрутки.

::-webkit-scrollbar {
    width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #1B242F; 
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #04C2C9; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover{
    background: #04C2; 
}

Для получения дополнительной информации посетите эту ссылку