chrome的input默认样式黄色背景以及选中加粗的边框处理

问题描述：

chrome输入用户名和密码，然后浏览器自己有记忆功能，等再次登录的时候，他会显示chrome默认的黄色背景色，还有选中时周围会有很粗的边框

解决方案：

去掉黄色背景，给input添加autocomplete=‘off’

去掉粗边框，给input添加outline：none;

时间： 2024-07-29 06:58:29

chrome的input默认样式黄色背景以及选中加粗的边框处理的相关文章

Chrome中输入框默认样式移除

Chrome中输入框默认样式移除在chrome浏览器中会默认给页面上的输入框如input.textarea等渲染浏览器自带的边框效果 IE8中效果如下: Chrome中效果如下: 这在我们未给输入框设置获取焦点时改变边框颜色时,chrome浏览器解析页面中默认将输入框获取焦点时改变边框效果,这给我们带来了极大的方便.如果我们要自己设置边框色时,chrome浏览器的默认操作就给我们的设置(boder:1px solid color)带来了问题,这是你会发现,你的设置在其他浏览器中时有效的,但

修改input默认样式

不说话,直接上代码不需要图片,css解决 <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" /&g

去掉谷歌浏览器输入框默认的黄色背景

谷歌浏览器登录页记住密码后下次登录会自动填充,并且有黄色背景. 谷歌浏览器的设置如下: input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { background-color: rgb(250, 255, 189); background-image: none; color: rgb(0, 0, 0); } 去掉黄色背景第一种方法是对它重写样式,使用!important提升优先级,除了chrom

safari input默认样式

在i标签下嵌套一个input标签设置了 -webkit-apprarence:none: 设置了宽高,和padding:3px 结果placeholder显示不全经排查这时候的input默认有圆角最后通过行高解决这个问题.

IE与搜狗input 默认样式

在IE10 及以上input框会加上默认的X号,密码框会加上小眼睛去掉的方法: ::-ms-clear,::-ms-reveal{ display:none; } 在搜狗浏览器下会给密码框加上小键盘图标,去掉的方法(只兼容急速模式): input::-webkit-input-safebox-button { display: none; } 至于为什么不兼容ie 因为ie没有shadow DOM. 什么是shadow DOM? 见 : ChokCoco 的 <神秘的 shadow-dom

样式重置取消input默认样式

body, h1, h2, h3, h4, h5, h6, hr, p,blockquote, dl, dt, dd, ul, ol, li,pre, form, fieldset, legend, button, input, textarea, th, td, img{border:medium none;margin: 0;padding: 0;list-style-type: none;}

chrome表单自动填充去掉input黄色背景解决方案

chrome表单自动填充后,input文本框的背景会变成偏黄色的,这是由于chrome会默认给自动填充的input表单加上input:-webkit-autofill私有属性,然后对其赋予以下样式: input:-webkit-autofill { background-color: #FAFFBD; background-image: none; color: #000; } 在有些情况下,这个黄色的背景会影响到我们界面的效果,尤其是在我们给input文本框使用图片背景的时候,原来的圆角和边框

如何解决在chrome中自动完成表单后input出现黄色背景

可以对input:-webkit-autofill使用足够大的纯色内阴影来覆盖input输入框的黄色背景:如: 代码如下: input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset; border: 1px solid #CCC!important; }

去掉chrome记住密码后自动填充表单的黄色背景

chrome 表单自动填充后,input文本框的背景会变成黄色的,通过审查元素可以看到这是由于chrome会默认给自动填充的input表单加上input:-webkit-autofill私有属性,然后对其赋予以下样式: input : -webkit-autofill { background-color : #FAFFBD ; background-image : none ; color : #000 ; } 在有些情况下,这个黄色的背景会影响到我们界面的效果,尤其是在我们给input文本框