删除自动填充时输入的黄色背景 [英] Remove the yellow background on input on autofill

问题描述

有谁知道如何在自动填充时删除这个难看的铬色背景？ （请参阅下文。）

Anyone knows how to remove this ugly chrome background when autofill? (Refer below.)

到目前为止，我尝试过：

So far I tried:

*:focus {
    outline: 0;
}
input:-webkit-autofill {
    -webkit-box-shadow: none;
    -webkit-text-fill-color: #fff !important;
}
button:focus, input:focus, a:focus {
    text-decoration: none !important;
    outline: none !important;
}

可悲的是，它们都不起作用。任何帮助，想法，线索，建议都将不胜感激。

Sadly, none of them works. Any help, ideas, clues, suggestions would be greatly appreciated.

推荐答案

奇怪的是，这是预期的行为，让用户推断它是自动填充的。

Oddly enough this is the intended behaviour from webkit to let the user infer it was autofilled.

[e-mail]
我们从WebKit继承了这种着色行为，我相信这是设计。它允许用户了解数据已经预先填好。

[e-mail] We inherit this coloring behavior from WebKit and I believe it's by design. It allows the user to understand the data has been prefilled.

您可以使用：

You can use:

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px white inset;
}

这会将背景更改为白色。

Which will change the background to white.

您也可以通过添加以下内容来关闭自动完成：

You can also turn auto complete off by adding:

autocomplete="off"

例如

E.g

<input type="text" name="some_name" autocomplete="off"></input>

对于您的输入，但为了可用性，我建议不要这样。

To your input, but for usability I would suggest against this.

这篇关于删除自动填充时输入的黄色背景的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！