苹果手机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";最终实现了字体颜色的样式修改。
苹果手机Chrome浏览器显示input:disabled时字体颜色总是为浅灰色的更多相关文章
- 中文版Chrome浏览器不支持12px以下字体的解决方案
中文版Chrome浏览器不支持12px以下字体的解决方案 Chrome 27之前的中文版桌面浏览器会默认设定页面的最小字号是12px,英文版则没有限制,主要是因为chrome认为汉字小于12px就会增 ...
- 取消chrome浏览器下input和textarea的默认样式;html5默认input内容清除“×”按钮去除办法
取消chrome浏览器下input和textarea的默认样式: outline:none;/*清空chrome中input的外边框*/ html5默认input内容清除“×”按钮去除办法: inpu ...
- 改变input的placeholder字体颜色
改变input的placeholder字体颜色,注意哦,只是placeholder的字,用户输入的字不可以 input::-webkit-input-placeholder{ coloc:#000; ...
- 去掉chrome浏览器中input或textarea在得到焦点时出现黄色边框的方法
此文来源网络,我转载的原文里的图显示“该图片仅限百度用户内部交流使用”,我估计这篇文章是从百度空间抄过来的,该作者没保留原文地址.所以我在这里也没保留抄袭文章的地址. chrome浏览器不管对于开发者 ...
- 去掉chrome浏览器中input获得焦点时的带颜色边框呢
可以设置表单控件的outline属性为none值, 来去掉Chrome浏览器中输入框以及其它表单控件获得焦点时的带颜色边框. css代码如下: input{outline:none}
- 一个解决chrome浏览器下input标签当autocomplete的时候背景变黄色同时input背景图片消失方案
最近在改一个bug即如标题所讲的一样,chrome浏览器下当input标签开启autocomplete的时候input的背景颜色变黄同时在input的背景图片也被覆盖了.为此百度了好久发现网上说的使用 ...
- 取消chrome浏览器下input和textarea的默认样式
最近一个细节引起了我的注意,chrome浏览器下的input和textarea在聚焦的时候都有一个黄色的边框,而且textarea还可以任意拖动放大,这是不能容忍的,影响美观不说,有时候拖动texta ...
- 关闭chrome浏览器的input香蕉黄背景
chrome浏览器input的自动完成,点击之后自动输入,input的背景会变成香蕉黄,用如下方法修复: /* Change the white to any color ;) 就是给input设置内 ...
- Html5 input placeholder 属性字体颜色修改。
这篇文章主要介绍了有关HTML5 input placeholder 颜色修改方面的知识,需要的朋友可以参考下 Chrome支持input=[type=text]占位文本属性,但下列CSS样式 ...
随机推荐
- localStorage本地存储技术
localStorage 本地存储技术 本地存储技术,“不是永久的永久存储” 特点: 将数据存储到浏览器当中 存储的数据都是以字符串的形式存储的 和传统的数据库相比: 优点: 操作简单,容易学习 数据 ...
- JavaScript---动态加载script和style样式
一个网页里面的内容理解为一个XML或者说网页本身也就是一个XML文档,XML文档都有很特殊的象征:"标签"也叫"节点". 一个基本的网页格式 <!DOCT ...
- Spring Boot 2 使用Servlet、Listener和Filter配置
开发环境:IntelliJ IDEA 2019.2.2Spring Boot版本:2.1.8 新建一个名称为demo的Spring Boot项目. 一.使用Servlet配置 1.修改启动类 Demo ...
- Violet音乐社区需求分析说明书
目录 一.引言 1.1 编写目的 1.2 开发背景 1.3 开发工具 二.项目需求 2.1 角色定义 2.2 模块划分 2.3 功能概述 2.4 数据流图 三.前端页面 四.软件要求 4.1 性能要求 ...
- cgo在mac上编译
用了cgo mac上编译不过的可以试试下面的方法 ../../pkg/mod/github.com/mattn/go-sqlite3@v1.:: fatal error: 'stdlib.h' fil ...
- June 30th, 2019. Week 26th, Sunday
It's so easy to be careless, it takes courage and courage to care. 不在乎很容易,但在乎却需要很多勇气. Sometimes it w ...
- 【西北师大-2108Java】第八次作业成绩汇总
[西北师大-2108Java]第八次作业成绩汇总 作业题目 面向对象程序设计(JAVA)--第10周学习指导及要求 实验目的与要求 (1)掌握java异常处理技术: (2)了解断言的用法: (3)了解 ...
- python第一次作业-Numpy练习
1.创建一个边界值为1而内部都是0的数组,图例如下:[提示:]解此题可以先把所有值都设置为1,这是大正方形:其次,把边界除外小正方形全部设置为0.本题用到numpy的切片原理.多维数组同样遵循x[st ...
- Docker安装MySQL 8.0并挂载数据及配置文件
安装部署环境 Ubuntu 18.04.3 LTS Docker 19.03.2 MySQL latest(8.0.17) 下载镜像 # docker从仓库中拉取最新版的mysql镜像,如果没加标签的 ...
- Paper | Highway Networks
目录 1. 网络结构 2. 分析 解决的问题:在当时,人们认为 提高深度 是 提高精度 的法宝.但是网络训练也变得很困难.本文旨在解决深度网络训练难的问题,本质是解决梯度问题. 提出的网络:本文提出的 ...