HTML input文本框自动填充黄色背景色解决办法

最新推荐文章于 2024-08-20 13:57:18 发布
原创 最新推荐文章于 2024-08-20 13:57:18 发布 · 4.2k 阅读 · 2 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#input框自动填充 #去除自动填充背景色 #去除黄色背景色

本文介绍了解决浏览器自动填充账号密码导致输入框背景变为黄色的问题。通过在input标签中添加autocomplete=“off”属性，并在CSS中设置特定样式，可以有效避免此现象，提升网页美观度。
部署运行你感兴趣的模型镜像

今天在写一个登陆界面的时候发现，浏览器保存登陆账户密码时，Input文本框会自动填充黄色背景色，影响美观，如下图所示
在这里插入图片描述
下面是解决方案，亲测有效：
在input标签里加上 autocomplete=“off”

<input type="text" placeholder="Email" name="email"  value="a@163.com"  autocomplete="off"/>

然后在css里加上

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

保存之后刷新页面
在这里插入图片描述

您可能感兴趣的与本文相关的镜像

ACE-Step

ACE-Step

音乐合成
ACE-Step

ACE-Step是由中国团队阶跃星辰（StepFun）与ACE Studio联手打造的开源音乐生成模型。 它拥有3.5B参数量，支持快速高质量生成、强可控性和易于拓展的特点。 最厉害的是，它可以生成多种语言的歌曲，包括但不限于中文、英文、日文等19种语言

如何修改 chrome 记住密码后自动填充表单的黄色背景？
liuhao9999的博客
03-23 795
chrome表单自动填充后，input文本框的背景会变成黄色的，通过审查元素可以看到这是由于chrome会默认给自动填充的in put表单加上input:-webkit-autofill私有属性，然后对其赋予以下样式： { background-color:rgb(250,255,189)!important; background-image:none!important; color:rgb(0,0,0)!important; } 对chrome默认定义的background-color，backg
《已解决》el-input自动填充时输入内容存在阴影
weixin_45928161的博客
06-04 1614
解决el-input自动填充时出现的样式效果
input文本框自动填充背景色黄色解决办法
热门推荐
草巾冒小子的博客
08-25 1万+
input文本框自动填充背景色黄色解决方式 如何取消黄背景色？浏览器兼容处理？ 本文目录： input文本框自动填充背景色黄色解决方式 解决前后，截图对比： 解决方式 兼容性说明 解决前后，截图对比： 解决方式 1 · 通过CSS代码约束 &amp;amp;lt;style type=&amp;quot;text/css&amp;quot;&amp;amp;gt; input:-...
input 自动填充导致的背景色问题
最新发布
weixin_43866627的博客
08-20 232
input:-internal-autofill-previewed,input:-internal-autofill-selected { transition: background-color 999999s ease-out 0.5s;}
html5设置文本框的背景色,css里我们选中一个div里的一个input设置背景色
weixin_36070568的博客
06-03 992
楼主问的是静态的设置背景色还是选中了input后变色？如果是保持颜色则如楼上所述，通过选择器设置input的css样式即可：divinput{background-color:#abcdef;}若为点击input后使其变色，则可以通过css的focus伪类为input设置背景色，具体代码如下：html>Thisisademoforbackground-color..box{h...
html input 按钮背景颜色调整
qq_16557835的博客
05-25 5932
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px white inset; // 背景设为白色 -webkit-text-fill-color: #fff; // 字体颜色 } input[type=button]:focus, input[type=password]:foc...
chrome表单自动填充导致input文本框背景变成偏黄色问题解决
09-25
总之，解决 Chrome 表单自动填充导致的背景色问题通常需要结合 CSS 样式和 JavaScript 技术，具体方法应根据项目需求和浏览器兼容性进行选择。保持对浏览器更新的敏感，并随时调整代码以适应新特性或行为的变化，是...
CSS为指定的input文本框添加背景
09-25
- `background-color`: 可以设定背景色，作为图像的底色。 - `background-position`: 控制背景图像的位置，如`center`、`top right`等。 - `background-size`: 设置背景图像的大小，可以是百分比或具体像素值。 ...
仿搜索引擎文本框自动补全插件
06-01
1. **文本框样式**：使用CSS设置文本框的边框、背景色、字体等属性，使其看起来与目标搜索引擎类似。 2. **建议列表样式**：创建一个CSS类用于建议列表的样式，包括列表项的字体、颜色、背景、边距、过渡效果等，...
动态改变HTML 的＜input＞ 标签的背景色
weixin_39017846的博客
10-15 3378
鼠标移动到input 元素上背景变色的方法
html 文本框 背景颜色,html标签：input输入框取消默认背景色、记住密码
weixin_36341500的博客
06-03 1021
1、css处理浏览器输入框记住账号密码后的背景色input:-webkit-autofill , textarea:-webkit-autofill, select:-webkit-autofill {-webkit-text-fill-color: #ededed !important;-webkit-box-shadow: 0 0 0px 1000px transparent inset !...
【我不熟悉的html】input框关闭自动填充，以及自动填充的下拉列表，autocomlete=“off“ 、修改name属性
有一棵树的博客
10-08 2392
【我不熟悉的html】input框的自动填充autocomlete="off"的使用
Html input输入框自动填充背景为黄色
心若向阳，无谓悲伤的博客
07-02 8961
开发完登录界面后，发现输入框在未聚焦的情况下，背景颜色为黄色，很影响界面美观。采用以下方法可以成功将背景色去掉：方法一：在input行内加入以下参数：autocomplete="off"但是加入以后，发现背景色还存在，只是没有选中时的外边框了。方法二：增加该属性：input:-webkit-autofill { box-shadow: 0 0 0px 1000px white inset;}两个方...
CSS3-关于input框autocomplete开启后 input框补全后默认背景颜色
weixin_44622984的博客
07-07 2350
今天在开发过程中碰到了这样的情况,input框在我设置好样式后,我点击进行输入值,一旦我选择自动补全(及它弹出的下拉框中的以前填过的数据),就会出现默认的背景颜色,极容易影响整体框体效果 如: 出现的这个默认背景颜色很影响整体效果,于是要进行清除,最终查到了input有个属性设置,设置如下即可清除 input:-internal-autofill-previewed, input:-internal-autofill-selected { transition: background-color 5
如何设定和改变html输入框控件的背景颜色
u013455166的专栏
02-13 9480
在操作页面时，有时我们需要设定或改变输入控件，如：<input type="text">控件。 1、当需要在设置其背景颜色时可以使用style="background:'color'"，例如，我们要定义一个背景色为浅蓝色的输入控件： <input type="text" id="demo" name="demo" style="background:'#D1EEEE'"&gt...
html设置input透明背景,input背景透明的穿透问题_html/css_WEB-ITnose
weixin_32620855的博客
06-10 3396
无标题文档文明扯淡，利国利民。当一个input框背景透明时(background-color:transparent;)，在ie下会被穿透，而在chrome等浏览器下则不会，有什么方法可以解决？回复讨论(解决方案)有人知道吗？可以用半透明的图片作为input的背景，而不是用文字，就可以解决可以用半透明的图片作为input的背景，而不是用文字，就可以解决+1或者试试滤镜吧把input中的背景图片设置...
解决input输入框自动填充账号密码出现背景色的问题
weixin_45899022的博客
04-30 5548
https://blog.youkuaiyun.com/qq_35393869/article/details/81978037
在html里文本框怎么设置背景颜色,css文本框颜色怎么设置
weixin_34552424的博客
06-24 9219
css文本框颜色的设置方法：1、使用color属性设置文本框内文字颜色；2、使用background-color属性设置文本框的背景颜色；3、使用border-color属性设置文本框的边框颜色。本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。1、使用color属性设置文本框内文字颜色文本框，默认文本颜色文本框，文本颜色为：红色效果图：2、使用b...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值