首页 >web前端 >html教程 > 正文

html隐藏属性如何使用

原创2021-04-27 11:35:150736

html隐藏属性的使用方法:1、使用disabled禁用input元素;2、readonly规定输入字段是否为只读;3、hidden属性值为true时,元素在界面上处于隐藏状态;4、display值为none表示此元素不会被显示。

本教程操作环境:windows7系统、html5版,DELL G3电脑。

html隐藏属性的使用方法:

1、disabled。HTML input 标签有一个 disabled 属性,该属性规定是否禁用 input 元素,被禁用的 input 元素既不可用,也不可点击,值为“disabled”。如果要启用该 input 元素,可通过 JavaScript 来删除 disabled 的值。被disabled禁用的元素,不能获得光标或者焦点,值只能通过JavaScript去设置,用户无法在界面上修改,且提交时该值不会提交到后台。

2、readonly。HTML input 标签有一个 readonly 属性,该属性规定输入字段是否为只读,只读元素不能输入,值为“readonly”。如果要使其变为可写,只能通过 JavaScript 来清除 readonly 的值。通过 readonly 设置为只读的元素,其值只能通过JavaScript去设置,用户无法在界面上修改,可以获得光标或者焦点,提交时该值会提交到后台,这是与disabled最大的区别。

3、hidden。该属性的值有true和false。该属性值为true时,元素在界面上处于隐藏状态,只能通过JavaScript去设置该元素的值,用户在界面上看不到该元素。这是与disabled和readonly的区别。提交时该值会提交到后台。

4、display。该属性用于设置元素如何显示。常用的值有:none、block、inline、inline-table。none表示此元素不会被显示;block表示此元素将显示为块级元素,此元素前后会带有换行符;inline表示此元素会被显示为内联元素,元素前后没有换行符,这是默认值;inline-table表示此元素会作为内联表格来显示(类似 table),表格前后没有换行符。当设置为none时,元素会隐藏起来,且不会占用页面空间。假如页面中从上到下有三个div元素,第二个div元素的display属性设置为none,那么界面上只能看到两个div元素,且是紧挨着。

相关学习推荐:html视频教程

以上就是html隐藏属性如何使用的详细内容,更多请关注php中文网其它相关文章!

php中文网最新课程二维码

声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理

  • 相关标签:html 隐藏属性
  • 相关文章

    相关视频


    网友评论

    文明上网理性发言,请遵守 新闻评论服务协议

    我要评论
  • 专题推荐

    作者信息
    推荐视频教程
  • HTML前端基础第六部HTML前端基础第六部
  • HTML5 Canvas 动画实战教程HTML5 Canvas 动画实战教程
  • HTML每日小知识(第二季)HTML每日小知识(第二季)
  • HTML 代码实例HTML 代码实例
  • 前端课程(五郞八卦棍系列)第一棍:HTML5前端课程(五郞八卦棍系列)第一棍:HTML5
  • 视频教程分类