填写form表单时,chrome会自动把历史数据记住,就是获取焦点时,input会有一个记录之前填写过的文本的下拉。
自动选择后,它的样式是固定的。
也就是说input在chrome下,当input自动填充后,会有一个默认的样式 ,如下:
input:-internal-autofill-selected {
background-color: rgb(232, 240, 254) !important;
background-image: none !important;
color: rgb(0, 0, 0) !important;
}
这个 background-color , 一般情况下,我们首选的 都是通过 样式覆盖,
然而在chrome中,覆盖了一次又一次,就是覆盖不了
查了一大堆文档也没说个原因出来
最后,使用了下面的方法,解决了问题。
box-shadow: inset 0 0 0 1000px #f7f7f7!important;
因为只有在之前有输入记录的情况下才会出现的,所以只有禁用input的记录就能ok!比如:
<input type="text" autocomplete="off">
如此当你点击了input时它就不会有那一列表了!