css - 如何查看 -webkit-scrollbar 和 -webkit-scrollbar-track 等的默认 css 样式？

Question

我正在尝试查看 webkit 伪元素的默认 css 值(可能是源代码？)，以便我可以创建与默认值非常相似但略有自定义的自定义 webkit 元素。

这些元素是不显示在 DOM 中的影子元素。您可以在 chrome devtools 设置中启用“Show user agent shadow DOM” Inspect webkit-input-placeholder with developer tools ，但我仍然没有在 DOM 中看到元素。我怀疑这些样式是由用户代理样式表为这些 webkit 元素提供的

Answer 1

使用您的浏览器加载一个使用有问题的 CSS 的页面，然后您可以使用开发人员功能来检查它。

1. 右键点击页面
2. 在 Chrome 中，菜单选项是“检查”
3. 屏幕会分开，页面源代码出现在屏幕底部(不确定如果在手机上浏览会发生什么)
4. 在屏幕底部，您将看到 html，在右下角您将看到相关的 CSS，您可以在右侧选择一些 html。
5. 注意最右边有样式表的链接，点击查看
6. 不幸的是，链接很难阅读，因为所有空格和换行符都已删除，但您可以将其粘贴到编辑器中，使其更易于阅读