zoukankan      html  css  js  c++  java
  • 苹果手机Chrome浏览器显示input:disabled时字体颜色总是为浅灰色

    今天被测试人员提了个bug:苹果手机浏览器(Chrome)打开h5,控件在input:disabled的样式始终是浅灰色,要求改成黑色。
    测试对比:1、在多个pc浏览器上浏览input:disabled的样式时,都是自己修改的黑色,但是在苹果手机上的浏览器Chrome打开就是浅灰色,修改无效。
    2、以为苹果浏览器特殊,在mac电脑上sarfri打开h5,显示为修改过的黑色
    3、以为是Chrome的问题,在安卓手机Chrome上尝试打开,发现显示正常,为修改过的黑色。
    定位为苹果手机的浏览器(Chrome)的特殊性。

    后来发现还是 User Agent 样式的问题。
    iPhone Safari/webview input disabled 的默认样式:
    input:disabled{
    opacity: 0.4
    }
    嗯,开发者工具只能看到这一条。 即便是 reset 为 opacity : 1 也无效。因为还有一条隐藏的样式 -webkit-text-fill-color ,于是有效的样式为 :

    input:disabled{
    color:"#353535";
    opacity: 1;
    -webkit-text-fill-color: "#353535";
    }

    配合使用 -webkit-text-fill-color: "#353535";最终实现了字体颜色的样式修改。

  • 相关阅读:
    善待自己的恻隐之心
    FormLayout and FormData
    jquery获取元素索引值index()方法
    Kohana 之ORM文档篇
    css 圆角相框
    Kohana 之 request
    firefox通过XUL实现textoverflow:ellipsis的效果
    jquery 插件开发备注
    Kohana 之ORM实际使用篇
    PHP扩展编写与编译
  • 原文地址:https://www.cnblogs.com/yechangzhong-826217795/p/11691093.html
Copyright © 2011-2022 走看看