html - 谷歌浏览器自动填充删除背景图片

Question

当我在电子邮箱中写入 电子邮件时，我没有问题并且显示完美。 但是当 google chrome 决定自动填充时，左侧的图像将被删除。 http://s9.postimg.org/suz3z56f3/Sem_t_tulo.jpg

我读过一些关于破解黄色背景的主题，这很有效，但图像继续消失。

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

//网页

<input type='email' class='email' placeholder='email'/>

//CSS

.email{
    background-image: url('http://www.letsgocook.net/sites/default/img/email.png');
    background-repeat: no-repeat;
    padding-left: 35px;
}

http://jsfiddle.net/9AM6X/ > 示例，但没有显示错误，因为我无法在 jsfiddle 中复制 chrome 的自动填充。

Answer 1

使用关键帧放回图像:

@-webkit-keyframes autofill {
    to {
        background-image:url(images/your-input-bg-image.svg);
    }
}

input:-webkit-autofill {
    -webkit-animation-name: autofill;
    -webkit-animation-fill-mode: both;
}

感谢@Steve 对 Removing input background colour for Chrome autocomplete? 的回答