详解::read-only只能读 只能写read-write 14

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
        
        .test1:-moz-read-only
        {
            border: 1px solid red;
        }
        
        .test1:-moz-read-write
        {
            border: 1px solid yellow;
        }
    </style>
</head>
<body>
    <form>
        启用:<input type="text" name="username" id="" class="test1">
        禁用:<input type="text" name="username" id=""   class="test1" readonly="readonly">
        <br>
        启用:<textarea class="test1"></textarea>
        禁用:<textarea class="test1" readonly="false"></textarea>
        <br>
        启用按钮:<input type="button" name="" value="btn1" class="test1">
        启用按钮:<input type="submit" name="" value="btn2" class="test1">
        启用按钮:<input type="reset" name="" value="btn3" class="test1">
        禁用按钮:<input type="button" name="" value="btn1" class="test1" disabled="disabled">
        禁用按钮:<input type="submit" name="" value="btn2" class="test1" disabled="disabled">
        禁用按钮:<input type="reset" name="" value="btn3" class="test1" disabled="disabled">
    </form>
</body>
</html>

核心:在这里插入图片描述
火狐要适配。要加上-moz-

readonly=“readonly”
readonly 属性规定输入字段为只读。
只读字段是不能修改的
问题可以不可以点击?
可以
disabled=“disabled”
disabled 属性规定应该禁用 input 元素。

被禁用的 input 元素既不可用,也不可点击

readonly=“false”,无效,也就是说不写就是这样。要写就写readonly="true"或者readonly="readonly"把
默认值,
readonly=“true”
和readonly="readonly"一样,没有区别

原创文章 107 获赞 14 访问量 1362

猜你喜欢

转载自blog.csdn.net/qq_37805832/article/details/105760650