display和visibility的区别
GPT4.0+Midjourney绘画+国内大模型 会员永久免费使用!
【 如果你想靠AI翻身,你先需要一个靠谱的工具! 】
visibility隐藏的对象还保留对象显示时所占的物理空间,display则不保留。
vilibility:hidden(隐藏)、visible(显示) style="vislbility:hidden"
display:none(隐藏)、block(显示) style="display:none"
可以保存下面的代码看看效果。
具体步骤:
代码示例:
1 2 3 4 5 6 7 8 | < div style = "border:1px solid #000;background:#eee" > < span style = "width:200;height:200;visibility:hidden" ></ span > ←SS属性为visibility:hidden的对象 < / div >< br > < div style = "border:1px solid #000;background:#666" > < span style = "width:200;height:200;display:none" ></ span > ←SS属性为display:none的对象 < / div > |
特别提示
用visibility属性控制隐藏的对象还占据着它显示时的位置,而display则没有。
特别说明
display属性设置元素的显示方式,对应脚本特性为display,可选值为none、block和inline,各值的说明如下:
none 隐藏元素,不保留元素显示时的空间。
block块方式显示元素。
inline 以内嵌方式显示元素。
inline-block对象显示为内嵌元素,但所有子对象都显示为块元素,相邻的内嵌元素将显示在同一行,允许空格。
list-item 将块元素显示为列表对象,并可以添加项目标点。(需要IE6.0+支持)
table-header-group 将元素作为表格标题组显示,相当于tHead元素。
table-footer-group 将元素作为表格脚注组显示,相当于tFoot元素。
visibility属性设置是否显示元素,对应的脚本特性为visibility,可选值为inherit、hidden和visible,各值的说明如下:
inherit 继承父元素的visibility属性设置。
hidden 隐藏元素,但保留其所占空间。
visible 显示元素(默认值)。
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持脚本之家!
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若内容造成侵权/违法违规/事实不符,请将相关资料发送至 reterry123@163.com 进行投诉反馈,一经查实,立即处理!
相关文章
- 根据某些条件来控制Web页面中的HTML元素显示还是隐藏,可以通过display或visibility来实现,下面有个简单的示例,大家可以参考下2014-06-16
通过display或visibility来实现HTML元素的显示与隐藏
需要根据某些条件来控制Web页面中的HTML元素显示还是隐藏,可以通过display或visibility来实现,感兴趣的朋友可以了解下本文2014-01-17css中display和visibility的用法和区别介绍
css中display和visibility想必前台美工对它并不陌生吧,如果你感觉自己对它还不是很熟悉的话,不妨了解本文对display和visibility的使用介绍2013-11-17谈谈CSS隐藏元素(display,visibility)的区别
在CSS中,让元素隐藏(指屏幕范围内肉眼不可见)的方法很多,有的占据空间,有的不占据空间;有的可以响应点击,有的不能响应点击2013-04-09css元素隐藏原理及display:none和visibility:hidden
在CSS中,让元素隐藏指屏幕范围内肉眼不可见的方法很多,只不过有的依然保留空间,而有的却消失的不留痕迹,接下来本文将详细介绍下css元素隐藏原理,感兴趣的你可不要错过2013-02-27display:none和visibility:hidden的差别比较与演示代码
display:none和visibility:hidden的差别:visibility:hidden隐藏,但在浏览时保留位置;而CSS display:none视为不存在,且不加载,感兴趣的朋友可以研究下2012-12-30关于CSS属性中visibility隐藏和display消失的区别简析
当html元素被设置为display:none;后,浏览器不会解析该元素,“none”就是没有,消失了,所以他不会再文档流中占位。而visibility:hidden;仅仅是视觉上消失了,“hidden”2012-12-07- visibility属性是隐藏元素但保持元素的浮动位置,而display实际上是设置元素的浮动特征2012-01-06
区别div和span、relative和absolute、display和visibility
div和span、relative和absolute、display和visibility是很容易混淆和弄错的HTML标签与CSS属性,今天52CSS.com简单的罗列出它们的区别与使用要点,供大家参考。2009-12-17- 大多数人很容易将CSS属性display和visibility混淆,它们看似没有什么不同,其实它们的差别却是很大的。 visibility属性用来确定元素是显示还是隐藏的,这用visibility=&qu2009-03-26
最新评论