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. 使用 requests

    基本实例 #利用requests库发送get请求 import requests r = requests.get('http://httpbin.org/get') print(r.text) 利用 ...

  2. python_ 函数

    函数是啥? 函数能提高应用的模块性,和代码的重复利用率 函数特点? 1 代码块以 def 关键词开头,后接函数名和圆括号() 2 任何传入参数和自变量必须放在圆括号中间 3 函数以冒号开始,并且缩进 ...

  3. 记一次禁止chrome打印出现空白页的情况

    项目中遇到一个问题:就是chrome浏览器打印时,会多少出一张空白页.经过Google,问题解决.

  4. 关于我与小组成员逐步升级C代码时的一些感想【第二次作业】

    #include<stdio.h> #include<stdlib.h> #include <time.h> int main(){ srand(time(NULL ...

  5. vue day5 分页控件 更新 PagedList.mvc 仿

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  6. 用汇编语言角度来理解C语言的一些问题

    在汇编的世界里,整数的存在和表示是没有有符号数和无符号数之分的,都是用数的补码表示,有无符号的计算是靠指令来进行确定.如JA/JB是用于无符号数的跳转指令,而JG/JL则是用于有符号数的指令.汇编中的 ...

  7. Go 常用命令

    Go 常用命令 含义 go run file_name.go

  8. angular2 ngfor循环

    angular2 在组件模板中可以循环数组集合等对象,语法非常简单,如: <ng-container *ngFor="let item of model.list"> ...

  9. httpd日志格式

    日志的缺省格式有如下几种: LogFormat "%h %l %u %t "%r" %>s %b "%{Referer}i" "%{U ...

  10. SQL ：“传入的表格格式数据流(TDS)远程过程调用(RPC)协议流不正确” 错误

    其中在DAL层调用存储过程来插入数据的参数 SqlParameter[] parameters = {                                            new S ...