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

 CSS display:none;

 使用该属性后,HTML元素(对象)的宽度、高度等各种属性值都将“丢失”;

 visibility:hidden;

 使用该属性后,HTML元素(对象)仅仅是在视觉上看不见(完全透明),而它所占据的空间位置仍然存在,也即是说它仍具有高度、宽度等属性值。

 

display:none和visibility: hidden二三事的更多相关文章

  1. CSS样式“display:none”与“visibility:hidden”区别

    CSS样式“display:none”和“visibility:hidden”都可以实现将页面元素隐藏,但是具体的效果是有差别的!下面通过两个小实验来说明这种差异. 实验代码: <!DOCTYP ...

  2. 前端面试题-display:none和visibility:hidden的区别

    一.display:none和visibility:hidden的区别 1.1 空间占据 1.2 回流和渲染 1.3 株连性 二.空间占据 display:none 隐藏后的元素不占据任何空间,而 v ...

  3. display:none与visibility: hidden的区别

    display:none和visibility: hidden都能把网页上某个元素隐藏起来,但两者有区别: display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失. ...

  4. 个人收集(转载)CSS中 display:none和visibility:hidden的区别

    visibility和display两个属性都有隐藏元素的功能,display:none和visibility:hidden的区别,简单的总结一句话就是:visibility:hidden隐藏,但在浏 ...

  5. display:none;与visibility:hidden;的区别

    visibility:隐藏对应的元素但不挤占该元素原来的空间.display:隐藏对应的元素并且挤占该元素原来的空间. 下面来看visibility和dispaly的一些参数 visibility用来 ...

  6. CSS样式display:none和visibility:hidden的区别

    同样是隐藏,display:none与visibility:hidden有什么区别呢? 虽然display:none与visibility:hidden都能达到隐藏可见元素的作用(视觉上),但事实上, ...

  7. display:none和visibility:hidden的区别[]

    display:none和visibility:hidden都是把网页上某个元素隐藏起来的功能,但两者有所区别,我发现使用 visibility:hidden属性会使对象不可见,但该对象在网页所占的空 ...

  8. css元素隐藏(display:none和visibility:hidden)

    在css中, display:none和visibility:hidden都能够使元素隐藏.但是两者所带来的效果完全不同. css  display:none 当使用该样式的时候,HTML元素的宽高等 ...

  9. CSS魔法堂:display:none与visibility:hidden的恩怨情仇

    前言  还记得面试时被问起"请说说display:none和visibility:hidden的区别"吗?是不是回答完display:none不占用原来的位置,而visibilit ...

随机推荐

  1. linux 信号列表和基本作用

    我们运行如下命令,可看到Linux支持的信号列表: $ kill -l 1) SIGHUP 2) SIGINT 3) SIGQUIT 4) SIGILL 5) SIGTRAP 6) SIGABRT 7 ...

  2. javascript弹窗基础篇

    confirm()意既确认框 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

  3. 【Qt】Qt之重启应用程序【转】

    简介 今天分享的内容有些意思-如何重启一个应用程序.其实,有时候这是一个很重要的功能点,而且很人性化.易用性很好. 例如:切换用户.当某个用户登录成功之后,需要切换到其它账号,那么这时,你就知道它的重 ...

  4. UVA10361 -自动作诗机

    UVA10361 - Automatic Poetry(自动作诗机) A Schuttelreim seems to be a typical German invention. The funny ...

  5. 仿UC天气下拉和微信下拉眼睛头部淡入淡出--第三方开源--PullLayout

    Android-PullLayout是github上的一个第三方开源项目,该项目主页是:https://github.com/BlueMor/Android-PullLayout 原作者项目意图实现类 ...

  6. Use a layout_width of 0dip instead of wrap_content for better performance.......【Written By KillerLegend】

    当你在一个Linearlayout布局中只为一个组件设置android:layout_weight属性时,那么这个组件将默认填充Linearlayout的剩余空间(宽度与高度方向),而不用事先进行测量 ...

  7. ref和out

    网上对这两个关键字的讨论,已经很多了,先给出一个链接:http://blog.csdn.net/xiaoning8201/article/details/6893154 自己做几条笔记,记得牢一些: ...

  8. Translation perface: <<Professional JavaScript for Web Developers, 3rd Edition>>

    It is a huge pitty to breaking translating this book. Sincerly speaking, I am striken by this great ...

  9. js中ajax异步导致的一些问题

    问题1:ajax默认是异步,所以在ajax中对外面定义的变量赋值,不能正确赋值 $("form").submit( var flag; $.ajax({ type: 'GET', ...

  10. 源码编译安装MySQL 5.7.9

    安装CentOS 6.3 配置yum:[root@hank-yoon ~]# cd /etc/yum.repos.d/ [root@hank-yoon yum.repos.d]# mkdir a [r ...