首页IT科技css隐藏元素 关键词(css 隐藏元素)

css隐藏元素 关键词(css 隐藏元素)

时间2025-09-19 11:47:45分类IT科技浏览5623
导读:display , visibility 仅会改变元素显示,不会改变元素种类。可以配合...

display , visibility 仅会改变元素显示                ,不会改变元素种类                。可以配合 js 使用使元素可以动态的显示隐藏                      。

可以使用 display 或 visibility 实现html元素的隐藏功能                      ,但是这两种方式有不一样的地方      。display 中的 none 值隐藏      ,元素后不会在占据页面空间            ,但是 visibility 的 hidden 值隐藏                       ,元素是看不见了不过会占据页面空间            。

display 说明

值 说明 none 隐藏                       。 block 使元素占据一行的全部空间          。 inline 使元素仅占据所需的宽度(作用元素中不能有块元素)        。

注意 : 使用 inline 时元素不能有块元素不然样式不生效                        。

<!DOCTYPE html> <html> <head> <style> li,div { display: inline; } </style> </head> <body> <p>把链接列表显示为水平导航栏:</p> <ul> <li><a target="_blank">HTML</a></li> <li><a target="_blank">CSS</a></li> <li><a target="_blank">JavaScript</a></li> </ul> <div>1</div> <div>1</div> <div><h1>2</h1></div> <div><h1>2</h1></div> p 标签内容被隐藏了 <div><p>123<p></div> </body> </html>

visibility 说明 用法和 display 差不多             。

值 说明 visible 默认值显示    。 hidden 元素不可见         ,但还占据页面上的空间 collapse 当在表格元素中使用时        ,此值可删除一行或一列                        ,但是它不会影响表格的布局                        。被行或列占据的空间会留给其他内容使用                 。如果此值被用在其他的元素上             ,会呈现为 "hidden"。 inherit 规定应该从父元素继承 visibility 属性的值                    。

创心域SEO版权声明:以上内容作者已申请原创保护,未经允许不得转载,侵权必究!授权事宜、对本内容有异议或投诉,敬请联系网站管理员,我们将尽快回复您,谢谢合作!

展开全文READ MORE
starry几岁(Ringo)