解决input框自动填充为黄色的问题

题原因：input 框会自动填充一个颜色  如图所示

 解决方法 ：通过动画去延迟背景颜色的显示  代码如下

 input:-webkit-autofill,
 textarea:-webkit-autofill,
 select:-webkit-autofill {
      transition: background-color 5000s ease-in-out 0s;
      -webkit-text-fill-color: #1cac17;   //设置填充字体颜色
 }

transition 属性用法：

//transition是动画属性，
transition: background-color 5000s ease-in-out 500s;  等同于
transition-property: background-color;  //设置过渡效果css属性的名称
transition-duration: 5000s; //  过渡效果持续时间
transition-timing-function: ease-in-out;//  以慢速开始和结束的过渡效果    详细请看http://www.runoob.com/cssref/css3-pr-transition-timing-function.html
transition-delay: 5000s;// 过渡效果延迟

讲个例子 

设置一个div ，背景颜色为白色，当鼠标hover时变为黄色，设置transition为  transition: background-color 5s ease-in-out 0s;

当鼠标悬浮时，五秒变为黄色。

同理，浏览器已经默认设置了auotfill时的颜色 ，现在只用设置transition: background-color 5000s ease-in-out 0s;

意思就是将在5000s显示黄色背景。

缺点：这个方法只是通过动画延迟了黄色背景的显示 ，并未从根本上改变背景颜色

方法2：

input:-webkit-autofill{
box-shaow: 0 0 0 1000px #fff inset
}

　

说明：这个方法值是用阴影的效果去遮盖黄色背景，但是只能用rgb颜色，rgba颜色设置透明度还是会出现黄色背景。这种方法只适合背景颜色为白色的时候