使用这个检查你的问题是否解决了

<input type="email" id="email" name="email" class="form-control validate" onfocus="this.removeAttribute('readonly');" readonly> 

这将适用于正常、悬停、聚焦和激活状态下的输入、文本区和选择。

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

下面是上述解决方案的SCSS版本，供使用SASS/SCSS的人使用。

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

除此之外:

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

你可能还想补充

input:-webkit-autofill:focus{
-webkit-box-shadow: 0 0 0px 1000px white inset, 0 0 8px rgba(82, 168, 236, 0.6);
}

另一方面，当你点击输入时，黄色会回来。 对于焦点，如果你使用bootstrap，第二部分是用于边界突出显示0 0 8px rgba(82, 168, 236, 0.6);

这样它看起来就像任何自举输入。

虽然在许多答案中可以找到的解决方案在Chrome中都可以使用，但在Mac和iOS的Safari中却不能使用。

Safari需要一个额外的语句- background-clip。

这是一个解决方案的完整代码，适用于不同平台上的所有主要浏览器:

/* Disable autofill highlighting */
input:-webkit-autofill {
    -webkit-text-fill-color: var(--text-input-color) !important;
    -webkit-box-shadow: 0 0 0 1rem var(--page-background-color) inset !important;
    background-clip: content-box !important;
}

(请用自己的值修改——text-input-color和——page-background-color)

你可以改变输入框的样式以及输入框内的文本样式:

在这里你可以使用任何颜色，例如白色，#DDD, rgba(102, 163, 177, 0.45)。

但透明在这里行不通。

/* Change the white to any color */
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;
}

另外，你可以用它来改变文本的颜色:

/*Change text in autofill textbox*/
input:-webkit-autofill{
    -webkit-text-fill-color: yellow !important;
}

建议:不要使用过多的模糊半径在数百或数千。这没有任何好处，而且可能会将处理器负载放在较弱的移动设备上。(也适用于实际的外部阴影)。对于一个普通的20px高度的输入框，30px的“模糊半径”将完美地覆盖它。

尝试隐藏自动填充样式

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:active,
input:-webkit-autofill:focus {
    background-color: #FFFFFF !important;
    color: #555 !important;
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
    -webkit-text-fill-color: #555555 !important;
}