浏览器表单记录用户名密码自动填充后有黄色背景,
看了下样式发现是一个样式的原因input:-webkit-autofill
网上查了下有人说添加个属性即可
autocomplete="off"
有人说添加到from属性里有人说添加到input里,试过都不管用,只能继续找解决方法了,
最后找到的解决方法如下:
对于纯背景色的表单添加以下样式即可
input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px #2390cc inset; }
修改后样式如下其实就是设置一个蓝色内阴影覆盖掉黄色背景而已,我对其他样式也做过一些修改:
网上还找到了拿图片做表单背景的解决方法,不过要在js代码里处理,这个还没有试过,先把代码附上
if (navigator.userAgent.toLowerCase().indexOf("chrome") >= 0) { $(window).load(function(){ $('input:-webkit-autofill').each(function(){ var text = $(this).val(); var name = $(this).attr('name'); $(this).after(this.outerHTML).remove(); $('input[name=' + name + ']').val(text); }); }); }
除了背景色还有自动填充的文字颜色也想修改,不过暂时还没找到解决方法,大家谁有好的方法留言哈,多谢了。
下面附张非自动填充的效果图
相关推荐
使用chrome浏览器选择记住密码的账号,输入框会自动加上黄色的背景,有些...方法2:修改chrome浏览器渲染黄色背景的时间 :-webkit-autofill { -webkit-text-fill-color: #fff !important; transition: background-c
总之,解决 Chrome 表单自动填充导致的背景色问题通常需要结合 CSS 样式和 JavaScript 技术,具体方法应根据项目需求和浏览器兼容性进行选择。保持对浏览器更新的敏感,并随时调整代码以适应新特性或行为的变化,是...
在这个例子中,我们监听了id为`inputField`的输入框的`input`事件,当用户输入的字符数超过10个时,输入框的背景色变为黄色,否则恢复透明。 总结起来,动态设置HTML的背景色主要依靠JavaScript和DOM操作。开发者...
如果开发者希望在用户记住密码之后,输入框仍然保持原来的样式,可以使用CSS的内阴影属性(`-webkit-box-shadow`)来覆盖默认的黄色背景色。例如: ```css input:-webkit-autofill { -webkit-box-shadow:000400px#...
当Chrome浏览器记录了用户在文本区域输入的内容,并在下次打开时显示,它会覆盖一层淡黄色背景。这种行为是为了提供之前输入内容的视觉提示,但如果你不希望出现这种情况,目前没有直接的CSS解决方案。这涉及到...
这个样式会给输入框添加淡黄色背景(`background-color: rgb(250, 255, 189)`)和特定的字体颜色。为了解决这个问题,我们可以使用CSS来覆盖这些默认样式。 一种常见的解决方案是使用`!important`来提升CSS样式的...
当`input`类型为`text`时,背景色设置为`#FFC`(浅黄色),否则背景色不会改变。这是一个简单的例子,展示了如何利用`expression`来实现条件样式: ```css input { background-color:expression(this.type=="text...
} }`,当屏幕宽度小于或等于600px时,背景色变为浅蓝色。 这些HTML5和CSS3的高级功能极大地扩展了网页设计的可能性,不仅提高了用户体验,也减轻了开发者的工作负担。通过合理运用这些功能,可以构建出更加美观、...
通过CSS样式可以轻松地定制按钮的外观,如背景色、边框等属性。示例展示了如何设置按钮的特殊颜色: ```html <input type=button name="Submit1" value="郭强" size=10 class=s02 style="background-color:rgb(235,...
这里展示了一个带有特殊背景色的按钮,其背景色定义为`rgb(235,207,22)`,这种橙黄色能够吸引用户的注意力。 ### 3. 鼠标移入移出时颜色变化 在按钮上添加鼠标悬停效果,可以使界面更加生动有趣,提高用户体验。 ...
通过CSS直接设置按钮背景色,例如: ```html <input type="button" name="Submit1" value="按钮" size="10" class="s02" style="background-color: rgb(235, 207, 22);"> ``` #### 2.2 鼠标移过颜色变化 通过 `...
设置按钮背景色 通过设置按钮的`background-color`属性来改变其背景颜色: ```html <input type="button" name="Submit1" value="按钮" size=10 class="s02" style="background-color: rgb(235, 207, 22);"> ``` ...
上述代码中,当输入框获得焦点时,背景色变为浅黄色(#FFFFCC),而当输入框失去焦点时,背景色会变为淡紫色(#D6D6FF)。这一变化通过blur()方法和focus()方法分别触发。 此外,为了演示如何手动触发blur事件,...
通过在`form-group`容器上添加相应的类名,可以改变输入框的背景色和边框颜色,以传达不同的反馈信息。例如: ```html 成功状态 <input type="text" class="form-control" id="inputSuccess1" placeholder=...
对于普通的按钮(type="button"),也可以通过CSS来定义其背景色。 尽管type选择器在现代浏览器中被广泛支持,但在IE6以及更早的浏览器版本中,这些选择器并不存在,从而导致同样的CSS代码在IE6中无法正常工作。...
简单表单input输入框提示插件1.0下载 17.另种效果的jQuery EasyValidator表单验证插件demo示例下载 18.漂亮绿色多级动感仿flash效果的jquery网站导航菜单 19.实用jQuery列表多项选择插件 20.实用jquery实现...
这将会为所有`span`元素设置文字颜色为红色,文字大小为20像素,并将背景色设置为黄色。 其次,如果CSS样式已经定义在样式表中,JQuery提供了一个`.addClass()`方法来添加一个或多个预定义的CSS类。这适用于那些...
`.message_box`是弹出层的核心,它的宽度为550像素,有5像素宽的红色边框,背景色为浅黄色。由于设置了`position:absolute`,我们可以精确地控制其在页面中的位置,通过`left`和`top`属性将其定位在页面的特定位置。...
例如,`<form>` 标签用于创建搜索表单,`<input>` 代表搜索输入框,`<button>` 作为提交按钮。 2. **CSS 样式**:CSS 是用于美化网页的关键,它负责设置颜色、字体、布局等视觉效果。在克隆 Google SERP 页面时,...