Как просмотреть стили CSS по умолчанию для -webkit-scrollbar, -webkit-scrollbar-track и т. Д.?

Question

Я пытаюсь увидеть, какие значения CSS по умолчанию (возможно, исходный код?) Предназначены для psuedoelements webkit, чтобы я мог создавать настраиваемые элементы webkit, которые очень похожи на стандартные, но слегка настроены.

Этиэлементы - это теневые элементы, которые не отображаются в DOM. Вы можете включить «Показывать теневой DOM агента пользователя» в настройках chrome devtools, для Проверять заполнитель-вкладку webkit с помощью инструментов разработчика , но я все еще не вижу элементов в DOM. Я подозреваю, что для этих элементов веб-набора эти стили предоставляются пользовательским агентом

Answer 1

Загрузите страницу, используя соответствующий CSS, в свой браузер, затем вы можете использовать функции разработчика для ее проверки.

1. Щелкните правой кнопкой мыши страницу
2. В Chrome менювыберите «Осмотреть»
3. Экран разделится, источник страницы появится в нижней части экрана (не уверен, что произойдет при просмотре по телефону)
4. В нижней части экрана,вы увидите html, в правом нижнем углу вы увидите соответствующий CSS, который вы выбираете html справа.
5. Обратите внимание, что справа есть ссылка на таблицу стилей, нажмите для просмотра
6. К сожалению, ссылка трудна для чтения, так как все пробелы и переводы строк удалены, но вы можете вставить ее в редактор и упростить чтение