• 技术文章 >web前端 >css教程

    css怎么将文本框设置为只读

    VV2021-06-08 16:15:19原创201

    css将文本框设置为只读的方法是,在input文本框中添加readonly属性即可。readonly属性是一个布尔属性,该属性用来规定输入字段是只读的。

    本文操作环境:windows10系统、css 3、thinkpad t480电脑。

    readonly属性是HTML中的一个布尔属性,该属性用来规定输入字段是只读的。

    我们知道只读字段是不能修改的,但是用户仍然可以使用 tab 键切换到该字段,还可以选中或拷贝其文本。

    readonly 属性可以防止用户对值进行修改,直到满足某些条件为止(比如选中了一个复选框)。然后,需要使用 JavaScript 消除 readonly 值,将输入字段切换到可编辑状态。

    注意:所有主流浏览器都支持 readonly 属性。

    举例:

    带有只读输入字段的 HTML 表单。

    <!DOCTYPE html>
    <html>
    <head> 
    <meta charset="utf-8"> 
    <title></title> 
    </head>
    <body>
    
    <form action="demo_form.php">
      Email: <input type="text" name="email"><br>
      Country: <input type="text" name="country" value="Norway" readonly><br>
      <input type="submit" value="提交">
    </form>
    
    </body>
    </html>

    运行结果:

    32110436d4e522ac393f72d860e6566.png

    相关视频分享:css视频教程

    以上就是css怎么将文本框设置为只读的详细内容,更多请关注php中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    专题推荐:css 文本框 只读
    上一篇:css中怎么设置table边框的颜色 下一篇:css如何清除input默认样式
    第16期线上培训班

    相关文章推荐

    • css怎么设置文字只读且不可复制• layui input只读属性是什么• html只读属性是什么• html怎么设置只读状态

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网