1.占据空间 ：none 隐藏后不占据空间 visibility占据空间
2.回流与渲染：none产生回流与渲染 ？ 可以通过oprea中的Profiler 工具测试。
display 和visibility的回流区别
回流 似乎是页面布局所需的时间
3.株连性：none 具有株连性 visibility没有。
也就是说如果设置了display：none 其子元素同样隐藏 但是visibility：hidden后 如果子元素有设置过 visibility：visible 那子元素不受父元素影响。

关于display：none 和visibility:hidden 的区别的更多相关文章

  1. 个人收集（转载）CSS中 display:none和visibility:hidden的区别

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

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

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

  3. display:none和visibility:hidden的区别？

    css控制元素不可见的方法 { display: none; /* 不占据空间,无法点击 */ } /************************************************* ...

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

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

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

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

  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. [HTML/CSS]display:none和visibility:hidden的区别

    写在前面 在群里有朋友问这样一个问题,display:none的标签,影响了布局.这就引出了本篇这样的问题,印象中display:none的块元素是不占位置的. 一个例子 <!DOCTYPE h ...

  9. css中display:none与visibility: hidden的区别

    display: none; 隐藏元素,不占用其本来空间------对应元素显示用的是display:block; visibility: hidden:元素隐藏,占用其本来的页面空间-------- ...

  10. CSS display:none和visibility:hidden区别

    你知道CSSdisplay:none和visibility:hidden的区别吗,这里和大家分享一下,使用CSS display:none属性后,HTML元素(对象)的宽度.高度等各种属性值都将&qu ...

随机推荐

  1. 如何从Exchange邮箱数据库批量删除特定邮件

  2. MYSQL （二）

    视图: 视图是一个虚拟表(非真实存在),其本质是[根据SQL语句获取动态的数据集,并为其命名],用户使用时只需使用[名称]即可获取结果集,并可以将其当作表来使用. 1.  尽量使用视图完成读操作 2. ...

  3. 说说APP接口中的版本控制

    引言 接口是APP的重要组成部分,数据是APP的核心,接口是连接APP和数据的纽带. 一般情况下,APP中会有大量的接口,再加上版本的变化,接口的升级,一个接口 可能会衍生出很多个稍有差异的接口,这个 ...

  4. mysql 远程连接数据库的二种方法

    http://blog.csdn.net/freecodetor/article/details/5799550 一.连接远程数据库: 1.显示密码 如:MySQL 连接远程数据库(192.168.5 ...

  5. BZOJ2730: [HNOI2012]矿场搭建

    传送门 图的连通性相关的必和割点割边之类的有关. 题目要求对于一个无向图,任意一点被删除后,所有点都和某些指定点是联通的. 这道题比较简单的做法就是求出来所有的块.对于一个块,如果块里有两个及两个以上 ...

  6. javascript的正则表达式学习

    关于反向引用 复制代码 代码如下: // 测试函数 function matchReg(reg, str) { var result = str.match(reg); if(result) { co ...

  7. ADO.NET--收藏整理别人的教程

    本文所有内容均从前辈的博客中收集整理而来,仅供自己学习参考的时候快速访问用. ADO.NET入门教程(一) 初识ADO.NET ADO.NET入门教程(二)了解.NET数据提供程序 ADO.NET入门 ...

  8. nginx_https

    nginx使用ssl模块配置HTTPS支持   默认情况下ssl模块并未被安装,如果要使用该模块则需要在编译时指定–with-http_ssl_module参数,安装模块依赖于OpenSSL库和一些引 ...

  9. CenterOS 7 常用命令

    1.防火墙开放端口      1.1 开启端口        # firewall-cmd --zone=public --add-port=80/tcp --permanent          1 ...

  10. HttpContext.Cache属性

    HttpContext基于HttpApplication的处理管道,由于HttpContext对象贯穿整个处理过程,所以,可以从HttpApplication处理管道的前端将状态数据传递到管道的后端, ...