CNode社区问个css问题【已解决】
iOS浏览器input[disabled/readonly]
,设置颜色效果不符合预期~
input:disabled, input[disabled] {
-webkit-text-fill-color: #5e5e5e;//这个属性会优先于placeholder的color样式和input color样式,导致两者颜色相同,而我想要两者不同。
color: #5e5e5e;// safari iphone没作用
background: #fff;
}
input::-webkit-input-placeholder {
color: #acacac;
}
只有iOS有这个问题,暂时没查到是哪个属性搞的鬼,请大家帮忙!感觉color总是被加上了opacity
一样的…
解决方案
- 思路:鉴于
-webkit-text-fill-color
属性优先于color
,这里使用它替代color
即可 - 其实很简单0.0,突然转过弯来的…
input:disabled, input[disabled] {
-webkit-text-fill-color: #5e5e5e;//分别设置
color: #5e5e5e;// safari iphone没作用
background: #fff;
}
input:disabled::-webkit-input-placeholder, input[disabled]::-webkit-input-placeholder {
-webkit-text-fill-color: #acacac;
color: #5e5e5e;
}