【问题标题】:How change input field style when address auto fills地址自动填充时如何更改输入字段样式
【发布时间】:2019-09-13 20:20:42
【问题描述】:

我已经在我的 chrome 浏览器中存储了地址,所以当我填写表格时,我会看到这样的弹出窗口:

当我选择一个地址时,输入字段会变成蓝色,如下所示:

如何更改 CSS,使输入字段不会变蓝。 我已经尝试了下面的代码,但没有用:

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 {
  background-color: transparent;
}

【问题讨论】:

标签: html css google-chrome autofill


【解决方案1】:

当您选择自动填充建议时,您无法进行透明输入,但您可以在自动填充建议后使用以下 CSS 更改输入字段的颜色:

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

您可以更改自动填充建议的文本颜色:

input:-webkit-autofill {
-webkit-text-fill-color: yellow !important;
}

【讨论】:

  • 我正在尝试更改背景颜色,而不是颜色。例如背景颜色:透明; ,我也尝试过使用 background-color:#000;这也行不通。
  • 是的,Sohail,在选择自动填充建议后,您无法更改输入的背景颜色,但您可以在输入字段上设置与背景颜色相同的框阴影。尝试升级我提供的 CSS 代码
猜你喜欢
  • 2020-10-24
  • 2023-03-16
  • 2021-11-10
  • 2020-09-18
  • 1970-01-01
  • 1970-01-01
  • 2014-05-07
  • 2016-11-08
相关资源
最近更新 更多