Как изменить цвет полосы прокрутки как на gitbook?

Question

[Богдан Кучерук]

Как изменить цвет ползунка, стрелки и самой полосы прокрутки чтобы было также как в примере?

Comments

[Сергей delphinpro]

Ответов на этот вопрос в интернете тысячи
https://yandex.ru/search/?text=how+to+customize+sc...
Зачем еще один вопрос задавать..

[Богдан Кучерук]

Сергей delphinpro, затем что стрелочка пропадает на всех этих прокрутках (абсолютно на всех). А здесь такой-же, только тёмный.

[Богдан Кучерук]

Сергей delphinpro, это:



Не равно этому:


И почему она всегда пропадает?

[Сергей delphinpro]

Богдан Кучерук, я открыл гитбук. Вижу только светлую тему и стандартный скроллбар, вообще никак не кастомизированный

[Богдан Кучерук]

Сергей delphinpro, https://docs.jioswap.finance/

[Сергей delphinpro]

Богдан Кучерук, да какая разница. Движок один и тот же. конкретно в этом случае скролл бар стилизуется самими браузером и будет отличаться в разных браузерах, на разных системах.

[Богдан Кучерук]

Сергей delphinpro, у меня что в хроме что в edge тёмная полоса:

[Сергей delphinpro]

Богдан Кучерук,

В остальном у вас два пути:

1. Использовать псевдоэлементы -webkit-scrollbar-*. Их много, в том числе и для кнопок со стрелками. Плюс ограниченно стилизовать для FireFox.
2. Использовать js библиотеку для скроллбаров. Не всегда надежно, иногда глючно, но стилизация под любой полет фантазии.

Других вариантов нет. Всё это, как я и сказал сразу вначале, тысячу раз обсосано в интернете.

[v3shin]

Богдан Кучерук, а почему бы вам не посмотреть, как это устроено на самом сайте? Правой мышью -> инспектировать.

[Ankhena]

По-моему, это обычная полоса от темной темы Хрома.

[RAX7]

html {
    color-scheme: dark;
}

[Богдан Кучерук]

RAX7, спасибо большое!!!

Answer 1

[Morkvart]

https://bloggood.ru/recepty-css/izmenit-polosu-pro...

Статья 2016 года правда, но думаю, стоит смотреть в этом направлении