Chrome 滚动条更新 121

Question

Chrome 几天前刚刚发布了更新 121，我刚刚注意到我网站上的滚动条看起来像这个丑陋的滚动条，而它们以前看起来像这个很酷的圆角滚动条

有办法解决吗？

Answer 1

Chrome 现在更喜欢新的滚动条属性 \xe2\x80\x94scrollbar-color以及用于设置滚动条样式的选择器scrollbar-width。-webkit-*升级到 chrome 121 后我也经历过这种情况，我在这里记录了我的案例https://syntackle.com/blog/changes-to-scrollbar-styling-in-chrome-121/。但一个快速解决方案是将新属性包装在@supports不支持 webkit 选择器的浏览器（例如 Firefox）的规则检查中。

\n

/* Wrap new scrollbar properties in @supports rule for browsers without `::-webkit-scrollbar-*` support */\n/* This way chrome won\'t override `::-webkit-scrollbar-*` selectors */\n@supports not selector(::-webkit-scrollbar) {\n  html {\n      scrollbar-width: thin;\n      scrollbar-color: var(--thumb-color) var(--track-color);\n  }\n}\n

\n

Answer 2

天哪，我以为这只是我安装的版本有问题。这是一个丑陋的更新。仅发生在基于 Windows 的机器上。我刚刚删除了这个：scrollbar-width: thin;现在一切都好