关于chrome浏览器-webkit-autofil覆盖input样式问题解决方案

1.在input内无图标时，网上搜的方案：设置如下.测试通过

input:-webkit-autofill {
-webkit-box-shadow: 0 0 0px 50px white inset !important;
}

2.偏偏今天做的是有图标的

这个样子。。坑爹!!!

最后下班前想到个注意可以解决图标的显示问题。没想到会是那么的简单。。

说下解决方法：

用label标签包含input，把图标放在label中并把input的样式设置下border、outline什么的。就可以实现和原本的布局了。