display:none与visibility:hidden有一个共同的作用是隐藏要显示的内容isplay:none 隐藏,但是不占空间 “看不见摸不到” 加载

display:none 隐藏,但是不占空间 看不见摸不到
不产生任何框,对布局没有影响,浏览器不显示其包括其后代元素,更不会占位

visibility:hidden 保留元素空间重绘,看不见 摸得到,相当于 留白 加载进来,因为他的空间是一直存在的,会生成元素框,只是元素不可视

针对他们的加载 现在有两种讨论,主要是针对于display:none的加载,visibility:hidden是页面加载时直接加载进来的,而对于display:none,到底是当其属性值从none改为block时才会加载还是一开始就加载进去不显示不占位,针对这个问题,有一个帖子也吵得挺厉害,具体是什么样不太清楚,个人感觉是一次性加载进去。

 

display:none与visibility:hidden区别的更多相关文章

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

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

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

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

  3. display:none和visibility:hidden区别

    <!-- display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别: --> <!-- display:none 不为被隐藏的对象保留其物理空 ...

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

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

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

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

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

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

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

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

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

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

  9. display:none和visibility:hidden v-show和v-if的区别

    隐藏元素display:none 和 visibility:hidden的区别visibility:hidden可以隐藏某个元素,但是隐藏的元素仍要占据空间,仍要影响布局display:none不会占 ...

  10. display:none和visibility:hidden的区别?

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

随机推荐

  1. Unity中Time.deltaTime的含义及其应用

    The time in scenes it took to complete the last frame.这是使用此函数的时候给出的提示 一般我们会在设置速度的时候看到这个函数.先写出我对Time. ...

  2. loadrunner随笔1

    快捷键: 注释快捷键:  ctrl+alt+c 取消注释快捷键:ctrl+alt+u 开始录制快捷键: ctrl+r 运行时设置快捷键: f4 录制设置: ctrl + f7 查找和替换:ctrl + ...

  3. 虚拟机VM安装linux系统

    废话不多说,直接上图文过程: 1.首先是下载linux镜像文件了(CentOS,Ubuntu等,根据自己的实际需求下载) linux镜像下载(提供几个32位的linux镜像下载,如有其他需求请自行百度 ...

  4. js多行省略

    $(function (){ // var $introduce = $(".c-introduce").html(); // $new_introduce = $introduc ...

  5. linux环境下android-ndk下的ffmpeg编译

    目前正在做手机底层播放器对的开发,需要用的ffmpeg,因为是新手,所以先从ffmpeg的编译开始做起.虽然是在前人的基础上,但是在linux上编译确实头一遭,因此在编译中,总有些坑是必须要填的,下面 ...

  6. Java8之——简洁优雅的Lambda表达式

    Java8发布之后,Lambda表达式,Stream等等之类的字眼边慢慢出现在我们字眼.就像是Java7出现了之后,大家看到了“钻石语法”,看到了try-with-resource等等.面对这些新东西 ...

  7. PDF 补丁丁 0.5.0.1816 测试版发布:新界面新体验

    新的测试版简化了界面,操作更直观,同时修复了旧版本的一些错误. 欢迎各位下载测试文件试用,并提出宝贵意见.

  8. go语言环境搭建

    1.官网https://golang.org/dl/下载go语言的执行器 2.此处以Windows操作系统上安装go为例,安装go1.7.3.windows-amd64.msi 3.配置go环境变量, ...

  9. asp.net链接数据库问题,设置收藏本站,设置主页

    SQL Server 2008附加数据库失败:无法打开物理文件拒绝访问解决方法 无法打开物理文件 "E:\SQLDATA\EMSXDB.mdf".操作系统错误 5:"5( ...

  10. asp.netajax开发应用心得-accordation控件的事件处理

    今天,再次运行以前的项目时,发现按钮的单击事件不起作用了,加了断点之后发现根本没有触发该事件.... 按照网上找到的答案,有的说把控件删掉重新拖拽一个进去,虽然以前也遇到过控件失效,重新拖拽有效的时候 ...