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

最新推荐文章于 2024-06-18 16:37:00 发布
最新推荐文章于 2024-06-18 16:37:00 发布
阅读量3.9k 收藏 2
点赞数
分类专栏： html 文章标签： input框自动填充 去除自动填充背景色 去除黄色背景色
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/JMasker/article/details/85258886
版权

今天在写一个登陆界面的时候发现，浏览器保存登陆账户密码时，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;}

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

KronosCzj
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
chrome表单自动填充导致input文本框背景变成偏黄色问题解决
09-25
总之，解决 Chrome 表单自动填充导致的背景色问题通常需要结合 CSS 样式和 JavaScript 技术，具体方法应根据项目需求和浏览器兼容性进行选择。保持对浏览器更新的敏感，并随时调整代码以适应新特性或行为的变化，是...
CSS为指定的input文本框添加背景
09-25
- `background-color`: 可以设定背景色，作为图像的底色。 - `background-position`: 控制背景图像的位置，如`center`、`top right`等。 - `background-size`: 设置背景图像的大小，可以是百分比或具体像素值。 ...
input文本框自动填充背景色黄色解决办法
草巾冒小子的博客
08-25 1万+
input文本框自动填充背景色黄色解决方式 如何取消黄背景色？浏览器兼容处理？ 本文目录： input文本框自动填充背景色黄色解决方式 解决前后，截图对比： 解决方式 兼容性说明 解决前后，截图对比： 解决方式 1 · 通过CSS代码约束 &amp;amp;lt;style type=&amp;quot;text/css&amp;quot;&amp;amp;gt; input:-...
html5设置文本框的背景色,css里我们选中一个div里的一个input设置背景色
weixin_36070568的博客
06-03 851
楼主问的是静态的设置背景色还是选中了input后变色？如果是保持颜色则如楼上所述，通过选择器设置input的css样式即可：divinput{background-color:#abcdef;}若为点击input后使其变色，则可以通过css的focus伪类为input设置背景色，具体代码如下：html>Thisisademoforbackground-color..box{h...
【css】如何修改input选中历史选项后，自动填充的蓝色背景色
最新发布
hzxOnlineOk的博客
06-18 541
自动填充前： 自动填充后： 改变input自动填充背景颜色 方法二：(vue element-ui框架) css设置背景色 input标签添加autocomplete=“off” // 指定某个文本框取消自动填充 form表单添加autocomplete=“off” // 取消所有文本框元素的自动填充 transiton（过渡）详解： （1）语法PS：transition-duration 时长为0，不会产生过渡效果（2）transition-timing-function属性：
html input 按钮背景颜色调整
qq_16557835的博客
05-25 5619
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...
Html input输入框自动填充背景为黄色
心若向阳，无谓悲伤的博客
07-02 8805
开发完登录界面后，发现输入框在未聚焦的情况下，背景颜色为黄色，很影响界面美观。采用以下方法可以成功将背景色去掉：方法一：在input行内加入以下参数：autocomplete="off"但是加入以后，发现背景色还存在，只是没有选中时的外边框了。方法二：增加该属性：input:-webkit-autofill { box-shadow: 0 0 0px 1000px white inset;}两个方...
仿搜索引擎文本框自动补全插件
06-01
1. **文本框样式**：使用CSS设置文本框的边框、背景色、字体等属性，使其看起来与目标搜索引擎类似。 2. **建议列表样式**：创建一个CSS类用于建议列表的样式，包括列表项的字体、颜色、背景、边距、过渡效果等，...
jQuery-HTML5-CSS3实现的文本框.zip
11-19
其次，CSS3（级联样式表第三版）则负责文本框的样式设计，包括但不限于边框、填充、背景色、字体样式、响应式布局等。例如，可以使用`border-radius`属性创建圆角文本框，`box-shadow`添加阴影效果，`transition`...
css+jquery美化文本框，选择框
11-11
3. **背景色与阴影**：设置`background-color`改变背景颜色，使用`box-shadow`添加阴影效果： ```css input[type="text"] { background-color: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); } ``` 4. **...
CSS3-关于input框autocomplete开启后 input框补全后默认背景颜色
weixin_44622984的博客
07-07 2157
今天在开发过程中碰到了这样的情况,input框在我设置好样式后,我点击进行输入值,一旦我选择自动补全(及它弹出的下拉框中的以前填过的数据),就会出现默认的背景颜色,极容易影响整体框体效果 如: 出现的这个默认背景颜色很影响整体效果,于是要进行清除,最终查到了input有个属性设置,设置如下即可清除 input:-internal-autofill-previewed, input:-internal-autofill-selected { transition: background-color 5
如何设定和改变html输入框控件的背景颜色
u013455166的专栏
02-13 8893
在操作页面时，有时我们需要设定或改变输入控件，如：<input type="text">控件。 1、当需要在设置其背景颜色时可以使用style="background:'color'"，例如，我们要定义一个背景色为浅蓝色的输入控件： <input type="text" id="demo" name="demo" style="background:'#D1EEEE'"&gt...
解决input输入框自动填充账号密码出现背景色的问题
weixin_45899022的博客
04-30 4696
https://blog.csdn.net/qq_35393869/article/details/81978037
修改input背景色
热门推荐
JavaCoderWolf的博客
05-10 1万+
document.getElementById(&amp;quot;xxx&amp;quot;).css(&amp;quot;background&amp;quot;,&amp;quot;red&amp;quot;);
css可以设置文本框颜色吗,如何在css中设置文本框颜色
weixin_35817967的博客
08-03 3553
如何在css中设置文本框颜色发布时间：2021-04-29 15:33:54来源：亿速云阅读：72作者：Leah如何在css中设置文本框颜色？针对这个问题，这篇文章详细介绍了相对应的分析和解答，希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。css的基本语法是什么css的基本语法是：1、css规则由选择器和一条或多条声明两个部分构成；2、选择器通常是需要改变样式的HTML元素；3、每条...
浏览器自带的autocomplete默认样式是淡黄色的背景
u014773932的博客
02-23 1477
浏览器自带的autocomplete默认样式是淡黄色的背景，字体也是黑色的 修改默认样式: /*改变浏览器autocomplete默认的样式*/ p.login-input input:-webkit-autofill{ -webkit-box-shadow: 0 0 0 1000px #002b43 inset!important; -webkit-text-fill-...
解决浏览器记住账户密码自动填充背景颜色解决办法
_江屿_
02-10 369
解决浏览器记住账户密码自动填充背景颜色解决办法
element中el-input 输入框 在自动填充（auto-complete=“on“）时，背景颜色会自动改变问题
zy的博客
08-29 1726
element中el-input 输入框 在自动填充（auto-complete="on"）时，背景颜色会自动改变问题
Input框自动填充背景色
05-30
如果你想要实现input框的自动填充背景色效果，可以使用CSS中的:-webkit-autofill伪类。这个伪类是Webkit内核浏览器（如Chrome、Safari）所支持的，可以针对自动填充的input框进行样式设置。例如，将自动填充的背景色...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值