input 在 chrome 下 , 自动填充后,默认样式清除

讨厌的自动填充背景色:

解决方法:

<style type="text/css">
input:-internal-autofill-selected {
    background-color: white !important;
    background-image: none !important;
    color: rgb(0, 0, 0) !important;
    box-shadow: inset 0 0 0 1000px white !important;
}
input:-webkit-autofill {
 box-shadow: 0 0 0px 1000px white inset !important;
}
input:-webkit-autofill:focus {
 box-shadow: 0 0 0px 1000px white inset !important;
}
</style>   

效果:

参考:https://blog.csdn.net/xiao_yu_liu/article/details/100582478

https://www.cnblogs.com/chenfanga/p/11600251.html

原文地址:https://www.cnblogs.com/digdeep/p/12419283.html

时间: 2024-11-09 00:53:42

input 在 chrome 下 , 自动填充后,默认样式清除的相关文章

chrome浏览器当表单自动填充时,怎么去除浏览器自动添加的默认样式。

参考blog来自 http://segmentfault.com/q/1010000000671971 chrome浏览器当表单自动填充时,怎么去除浏览器自动添加的默认样式. 一.发现该问题的原因-是在写账号登录页面时,input表单添加了背景图片,当自动填充,搓搓的一坨淡黄色背景出来. 这个原因是我草率的直接设置在input元素里面,结果问题就来了.所以如果把这个图标放在input表单外面,就不会出现这个问题. 二.表单自动填充会添加浏览器默认样式怎么处理和避免 第二张图,就是表单自动填充后,

Chrome表单文本框自动填充黄色背景色样式

开发后台管理系统或 网站时,使用谷歌的Chrome浏览器访问网页中表单,文本框背景色自动填充为黄色.这个问题在网络上其实早已经是老生常谈了,今天正巧我要处理这个问 题,把之前查阅的一些资料和自己解决这个问题的方法纪录在此,一是为大家遇到此问题时提供一份资料,二是作为自己的笔记.过多的话就不多说了,下面进入正 题. 一.首先介绍一下我遇到这个问题时文本框的样式情况:  上图为Chrome浏览器为表单中的文本框自动填充黄色背景色的样子, 我自己为文本框加的,获得焦点后,周围有蓝色阴影. <input

chrome浏览器自动填充失效问题

现在浏览器带有自动填充,一般在input标签中增加autocomplete="off" 可以进行控制,off代表不填充,on代表填充,这个属性也可以放在form标签中,对所有的input标签生效. 但是在某些浏览器上autocomplete="off"会失效,不起作用,本人经过chrome的实际测试发现可以增加一个input这个input的type必须是password,style="display:none",是的将这个放在form里作为第一个

chrome防止自动填充密码

是防止,不是禁止.禁止需要在浏览器设置. chrome浏览器保存密码之后,页面上有password存在的时候会出现自动填充用户名和密码的情况. 添加disableautocomplete和autocomplete="off"两个属性没有达到预期的效果. 发现测试页面存在两个password的时候就不会自动填充,遂在页面上加了个display:none的password, 成功, over:-D

Chrome 无法自动填充密码

问题: chrome 同步一切正常,在密码管理器https://passwords.google.com 也能看到自己保存的密码 但是在 设置 - 密码中看不到保存的密码,只能看到 “一律不保存” 的网站,登录网站的时候密码无法自动填充 退出chrome帐号并重新登录不管用 解决: 参考:https://www.v2ex.com/t/255542 15楼 点击右上角头像 - 管理用户 - 移除此用户 - 之后再登录就好楼 原文地址:https://www.cnblogs.com/tanrong/

去除下拉框的默认样式

select { /*Chrome和Firefox里面的边框是不一样的,所以复写了一下*/ border: solid 1px #000; /*很关键:将默认的select选择框样式清除*/ appearance:none; -moz-appearance:none; -webkit-appearance:none; /*将背景改为红色*/ background:red; /*加padding防止文字覆盖*/ padding-right: 14px; } /*清除ie的默认选择框样式清除,隐藏下

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

chrome表单自动填充导致input文本框背景变成偏黄色问题解决 作者:佚名 字体:[增加 减小] 来源:互联网 时间:08-21 18:43:32我要评论 chrome表单自动填充后,input文本框的背景会变成偏黄色的,想必大家都会碰到这种情况吧,这是由于chrome会默认给自动填充的input表单加上input:-webkit-autofill私有属性造成的,解决方法如下,感兴趣的朋友可以了解下 chrome表单自动填充后,input文本框的背景会变成偏黄色的,这是由于chrome会默认

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

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

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

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