javascript - 如何更改 Safari 自动填充黄色背景颜色

Question

这张图片是我从 safari 中得到的:

虽然这是我的代码:

来源:

How to Remove WebKit's Banana-Yellow Autofill Background

Remove forced yellow input background in Chrome - 即使它说 chrome 但仍然指向 webkit-autofill

我曾尝试使用 background-color:white !important; 来覆盖锁定的 css。调试工具显示 User Agent Stylesheet background-color 已被划掉，但颜色仍然没有改变，并且正在使用自定义。

这才是真正让我困惑的地方，我不知道为什么不允许更改用户代理样式表。

Answer 1

我发现那些包括 -webkit-box-shadow 和 background-color 的解决方案只能在 Google Chrome 浏览器中工作，而不能在 Safari 中工作。对我有用的是添加 background-clip: content-box。最后，代码(适用于所有浏览器)如下所示:

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active  {
    -webkit-box-shadow: 0 0 0 60px #fafafa inset !important;
    background-color: #fafafa !important;
    background-clip: content-box !important;
}