2 djcbpl DJCBPL 于 2016.05.05 17:40 提问

谷歌浏览器记住密码后input输入框样式问题

1、正确的情况如下图

正确显示的情况的效果图如下:
正确情况图

2、输入用户名和密码后点击登录

输入用户名和密码后点击登录;谷歌浏览器会弹出一个对话框;对话框如下图
谷歌浏览器提醒
对话框提示内容是“希望Google Chome保存您在此网站上使用的密码吗?”,点击按钮“保存密码”后;注销在次登录。

3、input的输入框样式倍改变

注销再次登录后的登录页面input输入框样式改变了;改变的效果如下图
图片说明

4、检查代码

打开控制台发现谷歌浏览器下的部分样式覆盖了;代码如下;
控制台代码

我使用了两种方法;发现没法覆盖那些样式;

请问有办法解决吗?

3个回答

showbo
showbo   Ds   Rxr 2016.05.05 20:47
已采纳
DJCBPL
DJCBPL 谢谢你!
大约 2 年之前 回复
DJCBPL
DJCBPL 谢谢你!
大约 2 年之前 回复
CSDNXIAON
CSDNXIAON   2016.05.05 17:42

Input输入框的各种样式
input输入框的各种样式
input输入框样式
----------------------同志你好,我是CSDN问答机器人小N,奉组织之命为你提供参考答案,编程尚未成功,同志仍需努力!

qq_14932021
qq_14932021   2016.05.05 17:48

这是因为Chrome浏览器中,记住密码会显示特有CSS样式,优先级比网页原来的高。
除非用户不使用密码记住功能,才能避免这种情况。

DJCBPL
DJCBPL 请问有办法吧谷歌浏览器弹出的那个对话框给禁用吗?
大约 2 年之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
Google浏览器记住密码造成input输入框黄色背景解决办法
google 浏览器记住密码黄色背景很令人讨厌,以前通过autocomplete= off等各种正统方法来去掉,但很遗憾的是现在这些方法都不管用了,目前得用一些奇技淫巧才能解决,网上说的通过设置内阴影的方法要慎用,如果input背景是黑色,则会造成文字显示异常,下面这种方法经测试,在各个浏览器表现良好,原理是通过transition颜色变换,此方法会引起光标颜色异常。可以使用caret-color...
解决谷歌浏览器记住密码输入框颜色改变
谷歌浏览器记住密码输入框颜色会改变,并且字体颜色会变成黑色, 这是由于谷歌浏览器的自带样式的缘故: input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
去掉chrome记住密码后的默认填充样式
当chrome记住密码的时候,input框的背景会默认填充为黄色,如图所示这是因为chrome做了这些个操作对chrome默认定义的background-color,background-image,color使用important是不能提高其优先级的,其他属性可使用。 使用足够大的纯色内阴影来覆盖input输入框的黄色背景,处理如下 input:-webkit-autofill , texta
Html+CSS 疑难杂症一 Chrome记住密码后黄色背景 的解决方法
chrome 表单自动填充后,input文本框的背景会变成黄色的,通过审查元素可以看到这是由于chrome会默认给自动填充的input表单加上input:-webkit-autofill私有属性,然后对其赋予以下样式: input : -webkit-autofill {background-color : #FAFFBD ;background-image : none ;colo
解决浏览器记住密码输入框的问题
使用HTML属性 autocompleteoff 使用js在页面加载的时候设置input的value为空 增加input typepassword 增加form 最终解决方案 Summary 在浏览器中提交表单后,浏览器一般会提示“是否需要记住密码”,确认后在下次提交表单的时候会自动填充某些输入框。但是在某些情景下(例如在提现,充值的页面),自动填充密码就很不安全。需要采用一定的手段来阻止浏览器自动
css处理浏览器输入框记住账号密码后的背景色
前言: 谷歌浏览器、在记住密码后,通常会给用户密码输入框渲染上一个背景色,在有些时候这个浏览器自动使用的渲染背景色会影响系统本身的UI界面,所以下面提供css方法处理解决。 如图所示的问题:          css代码: input:-webkit-autofill , textarea:-webkit-autofill, select:-webkit-a
chrome下记住密码后去掉黄色背景的方法
建议input内不要用图片背景,如果实在有图片,就在外层套个div,把图片背景放到外层去,黄色背景的出现是谷歌浏览器自带的,给input添加了一个样式: input : -webkit-autofill {background-color : #FAFFBD ;background-image : none ;color : #000 ;} 然后我们的目的就是去掉这个显示的
chrome自动填表会遮挡input中背景图的问题解决方法
在做某项目登录界面时,发现用户密码框在Chrome自动填充时,input中的背景框会被遮住。网上也搜了一下,没有一个有效的解决方法。 来看csdn的登录界面,也有这个问题。 后来在浏览网页时,无意中发现某网站的登录页面没有这个问题,于是分析了下它的css,照着试了一下,真的完美解决。我做的效果: 原理很简单,下面一个 div,上面放 div(显示图片) + inp
去掉chrome记住密码后自动填充表单的黄色背景
去掉chrome记住密码后自动填充表单的黄色背景
谷歌浏览器记住密码之后,输入框变色问题
如图:以前没有注意过。谷歌浏览器在记住密码之后,再次打开这个页面。输入框会有淡黄色的背景色。刚开始怎么都不行。后来偶然发现原来是有个:-webkit-autofill属性 于是,后来百度了下,发现有两个方法可以解决:不过我只试了一中,另外一种好像有点问题 方法一:给input标签添加内阴影,这个内阴影一定要大。要不然盖不住 .ipt_pwd:-webkit-autof