以下是代码,问题是它在桌面浏览器上运行良好,即禁用输入时显示红色,但在移动浏览器上它不显示红色,而是灰色,有什么想法吗?
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>testing</title>
<style>
input[disabled] {
color: #f55;
font-weight: bold;
}
</style>
</head>
<body>
<section>
<form id="myForm" method="post" action="forms.php">
<input type="text" name="username" value="Username" disabled> <br>
<input type="password" name="password" placeholder="Password"> <br>
<input type="submit" name="submit"> <br>
</form>
</section>
</body>
</html>
最佳答案
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>testing</title>
<style>
input[disabled] {
color: #f55;
font-weight: bold;
}
@media only screen and (max-width:1000px) {
input[disabled]{
color: #C90;
font-weight:bold;
}
</style>
</head>
<body>
<section>
<form id="myForm" method="post" action="forms.php">
<input type="text" name="username" value="Username" disabled> <br>
<input type="password" name="password" placeholder="Password"> <br>
<input type="submit" name="submit"> <br>
</form>
</section>
</body>
</html>
您可以为此使用媒体查询,与其将此样式放在 html 文档中,不如为长 css 保留外部样式表更合适....您可以通过在 @ 中为不同设备设置最大宽度来针对不同设备CSS 中的媒体
关于html - 如何在移动浏览器中更改/禁用输入文本颜色?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21328916/