chrome表单自动填充导致input文本框背景变成偏黄色问题

chrome表单自动填充后，input文本框的背景会变成偏黄色的，这是由于chrome会默认给自动填充的input表单加上 ** input:-webkit-autofill **私有属性，然后对其赋予以下样式：

 input:-webkit-autofill { 
  background-color: #FAFFBD; 
  background-image: none; 
  color: #000; 
} 

• input文本框是纯色背景
  可以对input:-webkit-autofill使用足够大的纯色内阴影来覆盖input输入框的黄色背景

input:-webkit-autofill{
    -webkit-box-shadow:0 0 0 1000px white inset;
    border:1px soldi #ccc!important;
}

• 如果你有使用圆角等属性，或者发现输入框的长度高度不太对，可以对其进行调整，除了chrome默认定义的background-color，background-image，color不能用!important提升其优先级以外，其他的属性均可使用!important提升其优先级

input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px white inset;
  border: 1px solid #CCC!important;
  height: 27px!important;
  line-height: 27px!important;
  border-radius: 0 4px 4px 0;
}

2. input文本框是使用图片背景的
   如果你实在想留住原来的内阴影效果，那就只能牺牲chrome自动填充表单的功能，使用js去实现

$(function() {
      if (navigator.userAgent.toLowerCase().indexOf("chrome") >= 0) {
        $(window).load(function(){
          $('ul input:not(input[type=submit])').each(function(){
            var outHtml = this.outerHTML;
            $(this).append(outHtml);
          });
        });
      }
});

遍历的对象可能要根据你的需求去调整。如果你不想使用js，好吧，在form标签上直接关闭了表单的自动填充功能：** autocomplete=”off” **。