修改input加disabled后的样式

最新推荐文章于 2024-09-09 16:26:49 发布
最新推荐文章于 2024-09-09 16:26:49 发布
阅读量6.6k 收藏 1
点赞数 1
分类专栏： css3 文章标签： disabled 默认样式
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/tang242424/article/details/87275809
版权

 安卓手机下禁用加了：

background-color: rgb(235, 235, 228);

苹果手机下禁用把透明度加到了0.3 。

修改默认样式只需加以下样式即可。

input[disabled]{
  filter: alpha(opacity=100);
  opacity:1;
  background: #fff;  
}

看一下安卓与苹果禁用后的区别

正常未禁用：                                                                安卓手机：

苹果手机：

 

 

小糖子先森
关注
专栏目录
微信小程序点击按钮动态切换input的disabled禁用/启用状态功能
12-28
做微信小程序项目的时候遇到一个功能，个人信息资料的修改与保存。以下是说明及简化后的代码： 1.页面加载完成时，所有input处于禁用状态；  2.点击编辑按钮时，文字切换成“保存”，身份证input保持始终不可修改状态（即禁用）， 姓名input可以修改（即动态加载切换禁用/启用）； 3.再次点击按钮文字切回“编辑”，所有input变为禁用状态。 以下是wxml部分 <view class=btn> <button bindtap=changeInfo>{{text}}</button> //绑定按钮的点击事件 </view> <view>姓名： <input class=
改变input在disabled状态下的样式
一入前端满是坑
01-10 1万+
input在disabled状态下，系统默认为变灰文字，以及透明度，所以光改文字颜色是不够的 input[disabled],input:disabled,input.disabled{ color: #333; -webkit-text-fill-color:#333; -webkit-opacity:1; opacity: 1; }
解决Element UI中el-input禁用状态的样式问题
qq_62685154的博客
09-09 1148
在使用Element UI进行前端开发时，我们经常会遇到需要自定义组件样式的情况。然而，当涉及到el-input组件的禁用状态（disabled）时，直接修改样式可能会遇到样式不生效或还原为初始样式的问题。这主要是因为Element UI内部对禁用状态有特定的样式处理，直接修改可能无法覆盖。本文将介绍三种解决el-input禁用状态样式问题的方法。
input禁用样式修改 input disabled样式禁用方法及样式isabled样式禁用方法及样式
weixin_30408675的博客
09-12 3154
disabled 属性规定应该禁用 input 元素。 被禁用的 input 元素既不可用，也不可点击。可以设置 disabled 属性，直到满足某些其他的条件为止（比如选择了一个复选框等等）。然后，就需要通过 JavaScript 来删除 disabled 值，将 input 元素的值切换为可用。 以下三种写法都可以禁用 input 1 2 3 ...
vue disabled样式更改（checkbox input ）
Xiao_XianYu_的博客
02-15 2442
一、checkbox更改disabled样式 /deep/ .el-input.is-disabled .el-input__inner { color: #606266;//在这里更改你所需要的样式 } 二、checkbox更改disabled样式 /deep/ .is-disabled .is-checked .el-checkbox__inner {//更改选中时选框的样式 background-color: #1890ff; border-color: #1890ff; }
Input Disabled默认样式问题
weixin_39782183的博客
03-07 563
input:disabled, textarea:diabled { -webkit-text-fill-color: #000; -webkit-opacity: 1; color: #000; } 以上样式将覆盖其系统默认设置的值，能够实现android和ios的兼容性。 其中,-webkit-text-fill-color是用来做填充色使用的，如果有设置这个值，则c...
antd React修改input框disabled字体颜色
最新发布
10-30
在Ant Design for React库中，如果你想修改`<Input>`组件在disabled状态下的字体颜色，你可以通过自定义样式或者直接设置`style`属性来实现。这里有两个方法： 1. **使用CSS样式覆盖**: 在项目的全局CSS文件中（如...
input设置了disabled=true后，直接加内联样式修改input的样式不生效，涂层效果无法去除
07-13
为了修改`disabled`状态下输入元素的样式，你需要使用CSS来选择该状态下的元素，并应用相应的样式属性。例如，如果你想要移除输入元素的涂层效果，可以使用以下CSS代码： ```css input:disabled { background-...
a-select 设置disabled之后修改它的样式和hover和input设置disabled一样
10-17
如果你想要改变禁用状态下的样式，使之与 `input[type="checkbox"]` 或 `input[type="radio"]` 等元素在鼠标悬停(`hover`)时的样式一致，可以自定义样式覆盖默认样式。你可以通过CSS针对`.ant-select-disabled`、`....
el-input disabled 样式修改
06-06
要修改el-input的disabled样式，可以使用以下CSS代码： .el-input.is-disabled { background-color: #f5f7fa; color: #c0c4cc; border-color: #e4e7ed; cursor: not-allowed; } 其中，background-color、color...
html按钮disabled状态,CSS定义input disabled样式的三种方法
weixin_34585343的博客
06-01 6824
表单提交的时候我们经常会让提交按钮禁用，满足条件后按钮恢复，disabled禁用按钮后怎么用CSS来改变禁用disabled按钮的样式呢？下面看青岛星网：CSS定义input disabled样式的三种方法。disabled 属性规定应该禁用 input 元素。被禁用的 input 元素既不可用，也不可点击。可以设置 disabled 属性，直到满足某些其他的条件为止(比如选择了一个复选框等等)。...
使用css样式 解决input 设置disabled="true"属性后变为灰色问题
idongit的博客
08-07 1万+
很简单为disabled设置背景颜色为白色（color设置的是input框中值的颜色）   input[disabled]{background:#fff;opacity:1;color:black;}
使input文本框不可编辑的3种方法
热门推荐
u010210251的博客
11-08 16万+
今天试了一下使input文本框不可编辑的3种方法，现在总结一下： disabled 属性规定应该禁用 input 元素，被禁用的 input 元素，不可编辑，不可复制，不可选择，不能接收焦点,后台也不会接收到传值。设置后文字的颜色会变成灰色。disabled 属性无法与 一起使用。 示例： readonly 属性规定输入字段为只读可复制，但是，用户可以使用Tab键切
支付宝小程序兼容问题总结...
weixin_55648290的博客
08-18 469
支付宝小程序兼容问题总结...
清除input默认样式，纯css自定义input checkbox样式
zengZeng的博客
01-04 2705
两种方式~ 一种是自己写一个checkbox的样式，如下： input[type="checkbox"]{ width:0.64rem; height:0.64rem; display: inline-block; text-align: center; vertical-align:baseline; line-height: 0.64rem; positio...
支付宝小程序--input输入框
milk_tiger的博客
07-13 1934
1.placeholder-class：placeholder 的样式类 1.6.0 及以上 <input class="input" value="{{inputValue}}" placeholder="显示默认值" placeholder-class="inputPlace" /> 2.type:输入框类型 text：默认 number：数字输入框 idcard：身份证输入键盘 digit：带小数点的数字键盘 3.password:是否是密码类型
支付宝小程序input的小坑
weixin_30783629的博客
07-19 1512
//axml<input class="internet_input" value="{{payNo}}" onInput="keyNum" controlled={{true}} type="text" /> 　 //js keyNum(e) { e.detail.value=e.detail.value.replace(/[\u4e0...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值