input输入框，自动填充时背景色问题

最新推荐文章于 2024-06-18 16:37:00 发布
最新推荐文章于 2024-06-18 16:37:00 发布
阅读量2.3k 收藏 3
点赞数 1
分类专栏： css 用到的小知识 文章标签： css javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/suannai01/article/details/106757241
版权

问题

最近再写一个保险的项目，会需要填充很多数据，然后就发现input框在自动填充时会出现背景色问题，有的会是黄色的背景，很丑
input自动填充前
在这里插入图片描述
input自动填充后

在这里插入图片描述
再网上找的解决方法，经测试***很有用***

 input:-webkit-autofill { box-shadow: 0 0 0px 1000px white inset !important;}
smile-linlin001
关注
  • 1
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
chrome表单自动填充导致input文本框背景变成偏黄色问题解决
01-21
chrome表单自动填充后，input文本框的背景会变成偏黄色的，这是由于chrome会默认给自动填充的input表单加上input:-webkit-autofill私有属性，然后对其赋予以下样式： 复制代码代码如下: input:-webkit-autofill { background-color: #FAFFBD; background-image: none; color: #000; } 在有些情况下，这个黄色的背景会影响到我们界面的效果，尤其是在我们给input文本框使用图片背景的时候，原来的圆角和边框都被覆盖了：  情景一：input文本框是纯色背景的 可以对input:-
input输入框自动填充后消除背景色
08-15 1315
【代码】input输入框自动填充后消除背景色。
【css】如何修改input选中历史选项后，自动填充的蓝色背景色
最新发布
hzxOnlineOk的博客
06-18 575
自动填充前： 自动填充后： 改变input自动填充背景颜色 方法二：(vue element-ui框架) css设置背景色 input标签添加autocomplete=“off” // 指定某个文本框取消自动填充 form表单添加autocomplete=“off” // 取消所有文本框元素的自动填充 transiton（过渡）详解： （1）语法PS：transition-duration 时长为0，不会产生过渡效果（2）transition-timing-function属性：
input 输入框 在自动填充时，背景颜色问题
荒的博客
01-14 250
//设置透明 input:-internal-autofill-previewed, input:-internal-autofill-selected { -webkit-text-fill-color: #807c7c; transition: background-color 5000s ease-out 0.5s; }
【CSS】消除浏览器输入框自动填充的背景色
qq_35187119的博客
04-17 2239
A：目前发现使用正常的手段，比如用 background-color 覆盖，均不能消除黄色背景。网上查阅相关文章，每个人都有自己的想法。但我发现有下面这种方法貌似是最简单的： input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { box-shadow: inset 0 0 0 1000p...
input修改自动填充背景色
weixin_42333548的博客
06-28 1690
input 修改自动填充背景色
el-input 改变背景色
qq_63871756的博客
04-08 1450
给输入区域改变背景色
jquery输入框提示插件input输入框文字下拉提示添加标签代码
11-11
标题和描述提到的“jquery输入框提示插件input输入框文字下拉提示添加标签代码”是一个关于如何利用 jQuery 和相关技术实现这种功能的方法。 这个插件的主要目的是当用户在输入框中输入文字时，提供实时的下拉提示...
chrome浏览器当表单自动填充时如何去除浏览器自动添加的默认样式
09-03
首先，问题的根源在于Chrome浏览器对自动填充的input元素添加了一个名为`-webkit-autofill`的私有样式。这个样式会给输入框添加淡黄色背景（`background-color: rgb(250, 255, 189)`）和特定的字体颜色。为了解决这...
输入框input样式，各种效果齐全
11-11
这包括但不限于边框、填充、背景色、字体、尺寸、对齐方式等。例如，我们可以设置输入框的边框和内边距： ```css input { border: 1px solid #ccc; /* 1像素的灰色实线边框 */ padding: 5px; /* 内边距为5像素 */...
14种CSS3炫酷表单input输入框美化效果
06-20
12. **背景色变化**：当输入框获取焦点时，可以通过改变`background-color`来强调当前活动的输入框。 13. **边框颜色过渡**：结合`:focus-within`伪类，可以在用户在表单区域内操作时，让整个表单区域的边框颜色...
react中操作dom元素自动填充
vuvivian的博客
12-09 1595
请求后台数据后，在该方法中将数据push进dom元素
消除input标签的自动填充 白色背景，及更改字体颜色
KangTongShun的博客
04-23 5966
一、 问题重现 在我门开发过程中难免会遇到这样的问题： 用户可能会选择浏览器自动填充 ![在这里插入图片描述](https://img-blog.csdnimg.cn/20200423172402337.png) 选择之后就变成了这样，很难看 二、问题解决 <input type='text'/> <!-- 假设我们的html是这样 --> 我们可以用 autofil...
关于input输入框自动填充密码后，出现背景颜色的问题解决
冰魂魄的博客
04-11 2102
inpuy自动填充密码时，点击密码会出现一个淡色的背景颜色
AntDV中a-input的默认样式修改
RepecTT的博客
07-14 4884
AntDV的a-input样式修改
CSS3中input(checkbox)复选框无法更改背景颜色等其他样式解决办法
王佳斌
11-22 5513
解决方法 选择器选中你的DOM，然后加入以下代码： input[type="checkbox"]{ -webkit-appearance:none; }
input使用自动输入autofill的时候，修改背景颜色
weikehang的博客
10-23 1193
input:-webkit-autofill , textarea:-webkit-autofill, select:-webkit-autofill { -webkit-text-fill-color: #ededed !important; //字体颜色 -webkit-box-shadow: 0 0 0px 1000px transparent inset !imp...
去掉input框自动填充时的背景色
05-30
如果你想要去掉input框自动填充时的背景色，可以使用CSS中的：-webkit-autofill伪类和box-shadow属性，将box-shadow设置为none即可。具体代码如下： ``` input:-webkit-autofill { -webkit-box-shadow: none; } ``` 这样就可以去掉input框自动填充时的背景色了。需要注意的是，这个伪类只在Webkit内核浏览器（如Chrome、Safari）中支持，其他浏览器可能需要使用其他的方法来去掉自动填充时的背景色。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值