chrome浏览器去除蓝色边框和黄色背景色

文本框出现这两种情况真是很糟心

1、在使用chrome浏览器时,选中文本框后会出现蓝色边框，导致页面很不好看   如何去掉呢？

    

    直接给文本框添加这个样式属性就可以解决问题了：outline:none;

2、chrome浏览器会自动记录搜过的关键字，在你下次点击文本框准备输入的时候会以下拉框的形式列出搜索过的关键词，当你点选列表中的关键词后，选中的关键词会自动填充到文本框中，但是此时，文本框的背景却发生了变化，变成了偏黄色，那么如何去掉呢？(所以最好不要让Chrome浏览器记住密码)

这是由于chrome浏览器默认的给自动填充的文本框添加了背景样式属性，chrome浏览器中查看元素里可以看到：

解决方法: (使用文本框边框阴影遮住了背景颜色     ---1000px即是阴影的宽度,只要这个宽度大于背景颜色的区域即可)

/* input:-webkit-autofill {
z-index: 100;
-webkit-box-shadow: 0 0 0px 1000px white inset;
} */

如果你引入了非常漂亮的背景图案,为何不尝试让其颜色为透明色,岂不更加完美!

  只要强制输入框不能自动搜索：添加属性autocomplete='off'即可