display:none和visibility:hidden都是把网页上某个元素隐藏起来的功能,但两者有所区别,我发现使用 visibility:hidden属性会使对象不可见,但该对象在网页所占的空间没有改变(看不见但摸得到),等于留出了一块空白区域,而 display:none属性会使这个对象彻底消失(看不见也摸不到)。
”这样的解释。
但是我觉得并不够,所以就想了一下关于他的一个加载问题。
有属性display:none;的结构在加载页面时,是否会同时加载呢?或则是当他变成display:block;的时候才加载的呢?
有属性visibility:hidden;   的结构在加载页面时,是否会同时加载呢?或则是当他变成visibility:visible;   的时候才加载的呢?

个人的看法是:
display:;当他的值变成block 的时候,它所在的结构才会被加载进来。
而visibility就会在加载页面的同时就已经把它加载进来了,因为他的值为hidden的时候,它所占的空间还在。

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

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

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

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

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

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

随机推荐

  1. apache开源项目--hadoop

    Hadoop 是一个分布式系统基础架构,由Apache基金会开发.用户可以在不了解分布式底层细节的情况下,开发分布式程序.充分利用集群的威力高速运算和存储.Hadoop实现了一个分布式文件系统(Had ...

  2. 看懂SqlServer查询计划

    看懂SqlServer查询计划 阅读目录 开始 SQL Server 查找记录的方法 SQL Server Join 方式 更具体执行过程 索引统计信息:查询计划的选择依据 优化视图查询 推荐阅读-M ...

  3. [Bhatia.Matrix Analysis.Solutions to Exercises and Problems]ExI.1.1

    Given any $k$-tupel of linearly independent vectors $X$ as above, there exists a $k$-tuple $Y$ biort ...

  4. nginx错误汇总

    一.Nginx出现413 Request Entity Too Large错误解决方法 Nginx出现的413 Request Entity Too Large错误,这个错误一般在上传文件的时候出现, ...

  5. 普通Java类获取spring 容器的bean的5种方法

    方法一:在初始化时保存ApplicationContext对象方法二:通过Spring提供的工具类获取ApplicationContext对象方法三:继承自抽象类ApplicationObjectSu ...

  6. HDU 4799 LIKE vs CANDLE 树形dp

    题意:有n个人,他们的关系,形成一棵有根树(0是树根,代表管理员),每个人有一个价值 现在有一条微博,每个人要么点赞,要么送一个蜡烛 初始一些人利用bug反转了某些人的操作(赞变蜡烛 或者 蜡烛变成赞 ...

  7. jquery 列求和

    列求和 var m = 0; $('#tb tr').each(function () { //td:eq(3)从0开始计数 $(this).find('td:eq(3)').each(functio ...

  8. APMServ5.2.6 + xdebug + notepad++调试环境配置

    (原创文章,转载请注明出处:http://www.cnblogs.com/qzhforthelife/archive/2013/06/21/3147772.html) 刚整了两个多小时才把这个调试环境 ...

  9. Esper系列(三)Context和Group by

    Context 把不同的事件按照框的规则框起来(规则框在partition by中定义),并且有可能有多个框,而框与框之间不会互相影响. 功能: 组合事件查询并进行分组,类型:Hash Context ...

  10. Weka 入门1

    本人也是借鉴网上他人资料.主要介绍使用java调用Weka库. 首先介绍weka,Weka的全名是怀卡托智能分析环境,是基于开源环境的机器学习和数据挖掘软件.我们可以去weka官网下载最新的Weka软 ...