Chrome输入自动填充问题

Question

如果这是重复的，很抱歉，但我找不到答案。我目前正在尝试禁用autoComplete，并从chrome上删除默认样式：active等。我尝试了各种示例，但都没有成功。

<input
type="email"
name="email"
className={style['form-control']}
id="exampleInputEmail1"
aria-describedby="emailHelp"
required
onComplete="off"
onChange={(e) => this.onChange(e)}
></input>

.form-control {
background-color: $bg3 !important;
width: 100% !important;
color: #D7E5F0 !important;
font-size: 14px !important;
padding: 7px 15px !important;
border: none !important;
}

铬：https://gyazo.com/cb8354cecb39fc9d8f479b4d5ecca3f7

Answer 1

现在找到了一个修复程序，代码如下：

.form-control,
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active {
background-color: $bg3 !important;
color: #D7E5F0 !important;
outline: none;
border: none !important;
-webkit-text-fill-color: #D7E5F0 !important;
-webkit-box-shadow: 0 0 0 30px $bg3 inset !important;
}