大家知道，如果想让某一段代码在前台不显示，最简单的方法是用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. IOS-项目中常见文件介绍

    一.项目文件结构示意图 二.文件介绍 1.products文件夹:主要用于mac电脑开发的可执行文件,ios开发用不到这个文件 2.frameworks文件夹主要用来放依赖的框架 3.test文件夹是 ...

  2. linux下使用FreeRDP 连接 Windows 远程桌面

    linux下使用FreeRDP 连接 Windows 远程桌面   简介 FreeRDP 是一款开源的远程桌面系统,支持多种平台, 在 ubuntu 中使用 FreeRDP 可以很方便的登录到 win ...

  3. mysql中的tinyint在C#中的类型

    mysql中的tinyint在C#中的类型 在C#中对应的类型是System.SByte,不是byte.

  4. Javascript-- jQuery动画篇(2)

    动画效果 前面的 hide/show,slide in/out 其实也具有动画效果,本篇介绍使用 animate()实现自定义动画效果. 基本语法如下: $(selector).animate({pa ...

  5. 字符串-----KMP竟然是18禁

    今天学了一下午字符串,讲到结束也没讲KMP.有人问老师为什么不讲,老师来一句:字符串noip不考,而且还是18禁,自然不讲.[手动滑稽] 所以我也不讲.[微笑] 1.表达式树 表示3+5*8 最后计算 ...

  6. Linux .o a .so .la .lo的区别

    o: 编译的目标文件a: 静态库,其实就是把若干o文件打了个包so: 动态链接库(共享库) lo: 使用libtool编译出的目标文件,其实就是在o文件中添加了一些信息la: 使用libtool编译出 ...

  7. 在初次安vs2008时设置的为C#现在怎么将其改为其他类型的界面

    如将C#改成C++, 工具 -> 导入和导出设置 -> 重置所有设置 -> 否,仅重置设置,从而覆盖我的当前设置 -> 重新选一个设置 -> 完成 选择完毕后,如新建MF ...

  8. Device-Dependent Bitmaps (DDB) 设备相关位图

    设备相关的位图(DDB)使用单一结构BITMAP结构描述.该结构的成员指定矩形区域的宽度和高度,以像素为单位;将条目从设备调色板映射到像素的数组的宽度;以及器件的颜色格式,在每个像素的颜色平面和位数方 ...

  9. PHP中查看PHP基本信息

    1.PHP_BINARY:查看PHP执行exe文件路径 <?php echo PHP_BINARY; ?> E:\PHP\php-7.1.3-Win32-VC14-x64\php.exe ...

  10. Leetcode 894. All Possible Full Binary Trees

    递归 # Definition for a binary tree node. # class TreeNode: # def __init__(self, x): # self.val = x # ...