如何删除chrome自动完成时的蓝色背景

Question

我正在创建一个表单，并希望每个输入都是透明的，但是当我在Chrome中使用自动完成功能然后选项卡进入下一个字段时，前一个字段会显示为淡蓝色背景。

我尝试过使用：

input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
    transition: background-color 5000s ease-in-out 0s;
}  

但这不起作用。我不想要白色背景我希望它在点击另一个输入时保持透明并将color设置为transparent也不起作用。

怎么能实现这一目标？

Answer 1

Google似乎对shadow属性做了一些魔术。这使它对我有用：

  input:-webkit-autofill,
  input:-webkit-autofill:hover,
  input:-webkit-autofill:focus textarea:-webkit-autofill,
  textarea:-webkit-autofill:hover textarea:-webkit-autofill:focus,
  select:-webkit-autofill,
  select:-webkit-autofill:hover,
  select:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0px 1000px #ffffff inset !important;
  }

Answer 2

您可能无法使用CSS在Chrome上删除它。最近这种情况变得越来越困难，因为谷歌对于开发人员试图隐藏或操纵其面向消费者的功能的所有方式都很苛刻。至少他们最近改为蓝色背景而不是黄色。完全避免我发现的唯一方法是使用隐身或访客窗口。