是否在版本72.0中更改了Google Chrome自动填充背景颜色?

问题描述 投票:7回答:3

我最近在谷歌浏览器中注意到,它为所有自动填充值的输入元素显示蓝色背景

Google Chrome auto fill background color

html google-chrome input autofill
3个回答
7
投票

是的Google将自动填充预览的背景颜色更改为GoogleBlue50。你可以在这里找到问题:https://bugs.chromium.org/p/chromium/issues/detail?id=935991

自谷歌Chrome 72以来,新的自动填充颜色是#E8F0FE / rgb(232, 240, 254)。在谷歌C​​hrome 72之前,自动填充字段用#FAFFBD / rgb(250, 255, 189)着色:

input {
  border: 1px solid black;
  padding: 4px 3px;
}
.show-autofill-new {
  background-color: #E8F0FE !important;
  background-image: none !important;
  color: #000000 !important;
}
.show-autofill-old {
  background-color: #FAFFBD !important;
  background-image: none !important;
  color: #000000 !important;
}
<input class="show-autofill-new" placeholder="since 72" type="text">
<input class="show-autofill-old" placeholder="until 72" type="text">

注意:如果您想要覆盖自动填充颜色,可以使用此问题提供的解决方案之一:


计划将来split the CSS rules for autofill previewed and autofill selected

  • 自动填充预览(在悬停自动填充建议时填写字段)。
  • 选择自动填充(字段填充自动填充建议)。

1
投票

是的,它改为浅蓝色。


1
投票

是的,Google已经因为一些未知原因改变了这一点。

它被跟踪,但它没有说明为什么它被改变:https://bugs.chromium.org/p/chromium/issues/detail?id=935991

此更新使其进入Chrome版本72.0.3626.119

在我看来,它看起来太像残疾人的风格。我想每个使用Chrome的人都已经习惯了自动填充输入的黄色背景,所以这可能会给用户带来很多困惑。

但是,就像所有事情一样,人们最终会习惯新的颜色。如果你真的想要它,你可以使用以下css:

input:-webkit-autofill, input:focus:-webkit-autofill {
   -webkit-box-shadow: 0 0 0 100px rgb(250, 255, 189) inset;
}

注意:这将覆盖您已应用于输入的任何框阴影。

© www.soinside.com 2019 - 2024. All rights reserved.