IE8浏览器下,被设置disabled属性后的元素修改字体颜色失效

问题描述

我们项目中有一个需求是,当用户第二次编辑之前保存过后的表单时,对修改字段进行标红处理(即将字段值的字体颜色变为红色),然而在IE8下,发现并没有生效。
经过筛查发现IE8浏览器下,将input标签置disabled="disabled"属性后,再改变其字段值的颜色就不会生效。
原因是,在IE8下被设置了"disabled"属性的元素的前景色将被渲染为灰色且带有白色阴影

解决方案

input[disabled] { color:#fff; opacity:1 }
disabled 默认是0.3,所以样式里一定要加opacity:1

特别说明

  1. 在实际过程中,先改变字体颜色,再置diabled属性和先置disabled的属性,再改变字体颜色效果都一样;
  2. 因为disabled属性与readonly属性的一些不同,我们需要统一使用disabled属性;
  3. 以上解决方案尚未经过仔细验证。

参考链接

how to change color of disabled html controls in ie8 usingcss

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

友情链接更多精彩内容