大家知道，如果想让某一段代码在前台不显示，最简单的方法是用css的display:none即可，这样下边的内容就自动上移或右侧的左移来填补这个空隙。

但特殊情况下我们只需要隐藏这个元素，但它的位置不能被占了，那该怎么实现呢。

突然发现css还有一个visibility属性，用 visibility:hidden;可以很方便实现隐藏元素在前台的显示，但它的位置不会被后边的元素抢占。

visibility:hidden | visible

display:none | block | inline

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

  1. 关于隐藏元素高度的问题 css visibility:hidden 与 display:none的区别

    其实这是一个老问题了,s visibility:hidden 与 display:none 共同点就是都会似的元素不可见.但是 visibility:hidden 的DOM元素是占用空间的,会挤占其他 ...

  2. visibility: hidden 和 display: none的区别

    相同点: 两者都可以将dom元素隐藏 不同点: 1.display: none 隐藏之后不占用文档流,而visibility: hidden却会占用文档流,如果要在隐藏元素的同时获取其尺寸信息,那就可 ...

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

    visibility: hidden----将元素隐藏,但是在网页中该占的位置还是占着. display: none----将元素的显示设为无,即在网页中不占任何的位置.

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

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

  5. 再谈visibility:hidden和display:none

    之前写过一篇有关visibility:hidden和display:none的文章:为什么要用用visibility:hidden;代替display:none;?主要是从浏览器性能方面入手,却没写两 ...

  6. 为什么要用visibility:hidden;代替display:none;？

    为什么要用用visibility:hidden;代替display:none;?因为后者更加消耗浏览器: css绘制画面有两种形式:repaint 和reflow,当我们更改css属相如backgro ...

  7. What is the difference between visibility:hidden and display:none?

    What is the difference between visibility:hidden and display:none? 答案1 display:none means that the t ...

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

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

  9. css 中visibility:hidden和display:none有什么区别呢

    <div style="width:100px;height:100px;background:red;visibility:hidden"></div>/ ...

随机推荐

  1. python 读取、保存、二值化、灰度化图片+opencv处理图片的方法

    http://blog.csdn.net/johinieli/article/details/69389980

  2. JSON的多样格式

    //JSON – Properties  方便前台列表显示 [{"年月":2002.01,"北京分公司":2214688,"河北分公司":3 ...

  3. 转载：Mongodb start

    Mongodb 操作 Start MongoDB The MongoDB instance stores its data files in the /var/lib/mongo and its lo ...

  4. vim 删除多列

    比如想删除一个文件的1-1000行的前3列: gg #到文件首ctrl+v #可视块模式999j,2l #注意是小写的J和L(方向键向下和向右也可以)d #删除

  5. [洛谷U62358]求导函数

    U62358 求导函数 题面 给出一个n次函数\(f(x)=a_{n}x^{n}+a_{n-1}x^{n-1}+...+a_{1}x+a_0\)的各项系数\(a_n,a_{n-1}...a_1,a_0 ...

  6. opencv画图

    #coding=utf-8 import cv2 import numpy as np img = cv2.imread("2.png",cv2.IMREAD_COLOR) cv2 ...

  7. [WinForm]Dundas Chart控件学习（附源码）

    1.Dundas公司简介 加拿大的一家公司,专业做图表展现的,很牛,据说现在被Microsoft收购了.官网地址:http://www.dundas.com/ 2.Chart基本要素 3.最简单的柱状 ...

  8. LeetCode OJ：Tenth Line（文件第十行）

    How would you print just the 10th line of a file? For example, assume that file.txt has the followin ...

  9. APUE学习笔记——5.2流与文件对象、fwide

    1 流         当一个文件被打开时,可以获得文件描述符.通过文件描述符可以对文件进行I/O操作.而I/O操作是通过流完成的. 流的定向:         在Unix系统中,使用 ASCII标准 ...

  10. Bireme：一个 Greenplum数据仓库的增量同步工具

    https://hashdatainc.github.io/bireme/ Bireme 是一个 Greenplum / HashData 数据仓库的增量同步工具.目前支持 MySQL.Postgre ...