Question

我已设法使用以下代码将自动填充输入字段的背景颜色从黄色更改为白色：

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

但是，仅通过添加color: #999;将字体颜色更改为灰色不起作用。我怎么能解决这个问题？非常感谢！

Answer 1

尝试以下 CSS

input:-webkit-autofill {
    -webkit-box-shadow:0 0 0 50px white inset; /* Change the color to your own background color */
    -webkit-text-fill-color: #999;
}
input:-webkit-autofill:focus {
    -webkit-box-shadow: /*your box-shadow*/,0 0 0 50px white inset;
    -webkit-text-fill-color: #999;
}

Answer 2

尝试以下CSS：

/* Change Autocomplete styles in Chrome*/
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus
input:-webkit-autofill, 
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  border: 1px solid green;
  -webkit-text-fill-color: green;
  -webkit-box-shadow: 0 0 0px 1000px #000 inset;
  transition: background-color 5000s ease-in-out 0s;
}

我们可以使用-webkit-autofill伪选择器来定位这些字段并根据需要设置样式。

Answer 3

input:-webkit-autofill {
    color: #999 !important;
}

这对你有用！

更改自动填充输入字段的字体颜色

3 个答案: