Google Chrome自动填充背景颜色是否更改？

Question

我正在尝试更改输入中的自动填充背景色。

在线接受的答案似乎与以下内容类似：

Removing input background colour for Chrome autocomplete?

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active,
input:-internal-autofill-selected,
input:-internal-autofill-previewed {
    background-color: white !important;
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}

这似乎在一种情况下可以接受，那就是当字段已经自动填充时。

意思是我刷新浏览器，并且字段中已经预先填充了用户名/密码。

当我将鼠标悬停或单击输入时，背景颜色会更改。但是，当我不执行任何操作时，box-shadow无效，并且仍设置为默认的user agent stylesheet。

input:-internal-autofill-selected {
    background-color: rgb(232, 240, 254) !important;
    background-image: none !important;
    color: rgb(0, 0, 0) !important;
}

我还尝试了一些随机属性，但没有成功。

input:-internal-autofill,
input:-internal-autofill:hover, 
input:-internal-autofill:focus, 
input:-internal-autofill:active,

Chrome版本77.0.3865.90（正式版本）（64位）

根本不知道如何覆盖它。就像它是在CSS规则的底部添加了important一样，因此无法覆盖吗？

Answer 1

对我来说，阴影效果不错，请尝试下面的代码。您可以根据需要更改阴影颜色。

input:-webkit-autofill {
    background-color: transparent !important;
    -webkit-box-shadow: 0 0 0 50px white inset;
}