chrome去除蓝色边框和黄色背景色

1、chrome在选中文本框后会出现蓝色边框，如何去掉呢？

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

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

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

这里第一想法是直接覆盖这个background-color，但是貌似不行，可以看到下面我已经覆盖了background-color这个属性，可底色还是黄色的：

百度上找到解决方案：添加相关的样式

input:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px white inset;}

其实不是屏蔽掉chrome浏览器默认添加的背景样式，而是使用文本框边框阴影遮住了背景颜色而已。样式中的1000px即是阴影的宽度，当然，只要这个宽度大于背景颜色的区域即可。

不过这只适合需要白色底色的情况，若是希望透明色怎么办呢？

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

chrome去除蓝色边框和黄色背景色相关推荐

chrome浏览器去除蓝色边框和黄色背景色
文本框出现这两种情况真是很糟心 1.在使用chrome浏览器时,选中文本框后会出现蓝色边框,导致页面很不好看如何去掉呢? 直接给文本框添加这个样式属性就可以解决问题了:outline:none; ...
input去除蓝色边框
input标签在使用的时候会有边框样式.当input聚焦的时候又会显示出一个蓝色边框. 很多时候我们并不需要这种默认样式的边框,就需要去除边框. 给需要去除的标签添加css样式: border: no ...
取消Chrome表单文本框自动填充黄色背景色样式
开发后台管理系统或网站时,使用谷歌的Chrome浏览器访问网页中表单,文本框背景色自动填充为黄色.这个问题在网络上其实早已经是老生常谈了,今天正巧我要处理这个问题,把之前查阅的一些资料和自己解决这个问 ...
去除input框点击后的一圈样式_去除input边框 input去除边框去除input获取焦点时的蓝色外边框...
去除input的边框 input{text-indent: 1em;} #search1{ } #search2{ border-width: 0; } #search3{ border:1px so ...
从Chrome中的css自定义样式按钮中删除蓝色边框
本文翻译自:Remove blue border from css custom-styled button in Chrome I'm working on a web page, and I wa ...
bootstrap~去除input选中时的蓝色边框线
1.去除input边框 .form-control{border:0;webkit-box-shadow:none;box-shadow:none; } 2.去除input选中时的蓝色边框线 .for ...
html消除按钮边框,在Chrome中从css自定义样式按钮中删除蓝色边框
在Chrome中从css自定义样式按钮中删除蓝色边框我正在做一个网页,我想要定制样式标签.因此,对于CSS,我说:border: none..现在它在Safari中运行得很好,但是在Chrome中, ...
html文本框加背景颜色,input输入框如何去除边框和修改背景色_html/css_WEB-ITnose
因为编辑和预览界面共用一个,考虑使用样式进行区分,上面代码要以下的结果: 不如意十八九请问各位能否实现回复讨论(解决方案) 用css就能实现定义一个class,然后定义边框 none,背景色不 ...
删除Chrome自动完成功能的输入背景色？
在我正在处理的表单上,Chrome浏览器会自动填写电子邮件和密码字段. 很好,但是Chrome将背景颜色更改为浅黄色. 我正在研究的设计是在深色背景上使用浅色文本,因此这确实弄乱了表单的外观-我有明显 ...

chrome去除蓝色边框和黄色背景色

chrome去除蓝色边框和黄色背景色相关推荐

最新文章

热门文章