css中display:hidden和display:none有什么区别

cssdisplay:hiddendisplay:none的区别是:1、【display:none】表示不存在且不加载,不为被隐藏的对象保留其物理空间;2、【display:hidden】是隐藏但在浏览时保留位置,及对象在网页上不可见。

css中display:hidden和display:none有什么区别

区别分析:

display:none视为不存在且不加载,即不为被隐藏的对象保留其物理空间,该对象在页面上彻底消失。

visibility:hidden隐藏,但在浏览时保留位置,即使对象在网页上不可见,但该对象在网页上所占的空间没有改变。

(学习视频分享:css视频教程)

立即学习“前端免费学习笔记(深入)”;

使用 display:none属性后,HTML元素(对象)的宽度、高度等各种属性值都将“丢失”;而使用visibility:hidden属性后,HTML元素(对象)仅仅是在视觉上看不见(完全透明),而它所占据的空间位置仍然存在。也即是说它仍具有高度、宽度等属性值。

举例:

            
A1 A2
B1 B2

效果:

33e739efc6ceb3325b922cfd710507a.png

在表格第二行的 tr 加上 style=”display:none”后:

f974416f38f0868523b48152d8a545f.png

在表格第二行的 tr 加上 style=”visibility:hidden”后:

dc49271eebf289a4a12343c7c8b5463.png

相关推荐:CSS教程

以上就是css中display:hidden和display:none有什么区别的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1616404.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
css怎么设置文字只读且不可复制
上一篇 2025年12月24日 05:24:25
css中有哪些字体属性
下一篇 2025年12月24日 05:24:41

相关推荐

发表回复

登录后才能评论
关注微信