display:none

1.使元素隐藏，不再占据空间。

2.动态操作时会引起页面回流和重绘，影响性能。

3.子元素也会被隐藏并且添加display:block/visibility:visible无效。

visibility:hidden

1.使元素隐藏，占据空间。

2.只引起页面重绘，性能开销相对较低。

3.子元素也会被隐藏，但是添加visibility:visible子元素会显示。

注：回流和重绘见基础总结（05）-- 回流和重绘

基础总结（04）-- display:none;&&visibility:hidden;区别的更多相关文章

  1. display:none;visibility:hidden;opacity:0;之间的区别

    什么是回流 当render tree中的一部分(或全部)因为元素的规模尺寸,布局,隐藏等改变而需要重新构建.这就称为回流(reflow).每个页面至少需要一次回流,就是在页面第一次加载的时候,这时候是 ...

  2. div和span、relative和absolute、display和visibility的区别

    一.div和span的区别 div是一个块级元素,可以包含段落,表格等内容,用于放置不同的内容.一般我们在网页通过div来布局定位网页中的每个区块. span是一个内联元素,没有实际意义,它的存在纯粹 ...

  3. display:none和visibility:hidden区别

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

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

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

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

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

  6. hidden="hidden"，display:none, visibility:hidden 三者的区别

    三者都可以实现隐藏元素的效果 1:display:none 就是把元素隐藏,即在页面上看不到这个元素,并且不占据任何位置 2:hidden="hidden"在页面展示出来效果跟di ...

  7. display 和 visibility 的区别

    设置控件隐藏 1.display:none  不为元素保留位置 2.visibility:hidden  占位置,是对象在网页上看不到,所占空间没有变化

  8. display和visibility的区别

    一.display和visibility的相同与不同点 1.相同点:display和visibility都有讲元素隐藏的意思 2.不同点:display是元素隐藏,隐藏的元素不占文档流 而visibi ...

  9. Display与 Visibility的区别

    隐藏元素的方法有: display:none或visibility:hidden visibility:hidden可以隐藏某个元素,但隐藏的元素仍需占用与未隐藏之前一样的空间.也就是说,该元素虽然被 ...

随机推荐

  1. 不使用循环或递归判断一个数是否为3的幂（leetcode 326）

    326. Power of ThreeGiven an integer, write a function to determine if it is a power of three. Follow ...

  2. python利用requests和threading模块，实现多线程爬取电影天堂最新电影信息。

    利用爬到的数据,基于Django搭建的一个最新电影信息网站: n1celll.xyz  (用的花生壳动态域名解析,服务器在自己的电脑上,纯属自娱自乐哈.) 今天想利用所学知识来爬取电影天堂所有最新电影 ...

  3. DashBoard创建各种表（一）

    创建透视表 1.首先需要创建一个DashBoard,然后点击开始导航栏中的透视,创建一个透视表,透视表可以交叉式的显示报告,让我们可以更直观的看到多维数据. 2.把CategroyName和Categ ...

  4. Qt实现 动态化遍历二叉树（前中后层次遍历）

    binarytree.h 头文件 #ifndef LINKEDBINARYTREE_H #define LINKEDBINARYTREE_H #include<c++/algorithm> ...

  5. 软件测试_Fiddler抓包工具一

    多数资料摘抄至 https://www.cnblogs.com/miantest/p/7289694.html 一.在 macOS 下如何安装 (https://www.telerik.com/fid ...

  6. centos安装mycat

    1.参考前文安装jdk 2.官网 http://www.mycat.io/ 或 http://dl.mycat.io/ 下载mycat 3.解压安装 cd /usr/local cp /home/ta ...

  7. python画高斯分布图形

    高斯分布,也叫正态分布,是一个在数学.物理及工程等领域都非常重要的概率分布,在统计学的许多方面有着重大的影响力. 若随机变量X服从一个数学期望为μ.方差为σ^2的正态分布,记为N(μ,σ^2).其概率 ...

  8. WiFi万能钥匙 for Macv1.1.0中文版

    wifi万能钥匙 for Mac是一款运行在Mac平台上的免费WiFi热点软件,Mac分享无线流量.管理WiFi连接的必备神器.WiFi万能钥匙Mac版内置千万Wi-Fi热点数据,随时随地轻松接入无线 ...

  9. 如何长期试用Beyond Compare 4

    打开Beyond Compare 4,发现已经过了试用期   我们可以点击立即购买,购买相关的Beyond Compare 4产品,如果你已经有密钥了,可以选择使用密钥   如果还想继续试用,则找到自 ...

  10. 详解java定时任务---Timer篇

    一.简介      在java的jdk中提供了Timer.TimerTask两个类来做定时任务. Timer是一种定时器工具,用来在一个后台线程计划执行指定任务,而TimerTask一个抽象类,它的子 ...