支持 Edge 浏览器中的滚动条样式

Question

看起来您可以在 IE 11 中使用 IE 特定的滚动条样式，例如：scrollbar-face-color、scrollbar-track-color 等，但不能用于 Edge。 Edge 有替代品吗？

Answer 1

如果没有 official documentation, clear indications, or official word from the dev team，很难具体知道，但根据之前关于 Edge 的目的和设计目标的评论，这似乎不太可能。

这就是我这么说的原因：

您所指的属性最初添加到 IE8 as extensions to the CSS 2.1 specification. These properties are non-standard and considered illegal in some circles. (There are other non-standard variations，但尚不清楚 MS Edge 是否支持它们。）

可以明确的是，Edge 可能未正式支持这些特定属性，大概是因为它们是专有扩展。

这似乎不太可能改变，因为 MS Edge 的主要设计点之一是搁置遗留兼容性以支持标准和跨平台互操作性。（而且，鉴于 major functionality changes 是在没有更改主要或次要版本号的情况下针对 IE11 制作的，因此在任何给定更新后对非标准属性的支持可能会消失是完全可行的。）

这些属性在您使用的构建中起作用的事实可能是一个深思熟虑的设计决定，或者这可能是 Edge 基于 Trident 引擎的一个分支这一事实的副作用，其中有很多行遗留代码已被删除。

再次声明，未经官方确认或公告，这都是基于经验和之前团队行为的猜测。你的旅费可能会改变。

希望这对您有所帮助...

-- 兰斯

Answer 2

您可以执行以下操作：

/* 适用于 Chrome、Edge 和 Safari */

*::-webkit-scrollbar {
  width: 12px;
}

*::-webkit-scrollbar-track {
  background: orange;
}

*::-webkit-scrollbar-thumb {
  background-color: blue;
  border-radius: 20px;
  border: 3px solid orange;
}

更多信息：https://www.digitalocean.com/community/tutorials/css-scrollbars

支持 Edge 浏览器中的滚动条样式

Support for scroll bar styling in Edge Browser

css

internet-explorer

scrollbar

microsoft-edge