Стилизация скроллбаров
В Chrome 121 завезли поддержку свойств
Свойство
-
-
-
Ширину в пикселях задавать нельзя, так решили при доработке стандарта. Что для пользователя, наверное, лучше: есть привычный элемент UI, который узнаётся по форме и размеру, на каждом сайте.
Свойство
Брамус делится примером, как добавить совместимость со старыми браузерами и WebKit. В Firefox всё работает с 2018 года. Кстати, для Safari нужен костыль, если вы меняете цвет скроллбара на лету.
https://developer.chrome.com/docs/css-ui/scrollbar-styling
В Chrome 121 завезли поддержку свойств
scrollbar-width и scrollbar-color. Там и раньше было наследие WebKit с префиксами, но теперь будет работать по стандарту.Свойство
scrollbar-width принимает три значения:-
none — прячет скроллбар, но оставляет возможность скроллить;-
auto — дефолтный системный скроллбар;-
thin — скроллбар потоньше.Ширину в пикселях задавать нельзя, так решили при доработке стандарта. Что для пользователя, наверное, лучше: есть привычный элемент UI, который узнаётся по форме и размеру, на каждом сайте.
Свойство
scrollbar-color принимает два цвета. В примере scrollbar-color: yellow green сам скроллбар будет жёлтый, а трек под ним — зелёный.Брамус делится примером, как добавить совместимость со старыми браузерами и WebKit. В Firefox всё работает с 2018 года. Кстати, для Safari нужен костыль, если вы меняете цвет скроллбара на лету.
https://developer.chrome.com/docs/css-ui/scrollbar-styling