大家知道,如果想让某一段代码在前台不显示,最简单的方法是用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. 基于dapper的通用泛型分页

    1.定义一个用来装载适合所有类的分页结果类 public class PageDataView<T> { private int _TotalNum; public PageDataVie ...

  2. linux---网络相关配置,ssh服务,bash命令及优先级,元字符

    - 二:临时配置网络(ip,网关,dns)+永久配置 临时配置: [root@nfs-server ~]# ifconfig ens32: flags=4163<UP,BROADCAST,RUN ...

  3. linux---tar命令,vim编辑器,磁盘分区,挂载,链接

    1) 将用户信息数据库文件和组信息数据库文件纵向合并为一个文件/1.txt(覆盖) [root@bogon ~]# cp /etc/passwd ./ [root@bogon ~]# cp /etc/ ...

  4. leetcode 559. Maximum Depth of N-ary Tree

    Given a n-ary tree, find its maximum depth. The maximum depth is the number of nodes along the longe ...

  5. Python中面向对象的一些关于私有变量和继承的理解

    成员可见性,变量和方法的可见性.使用“__”开头的变量和方法为私有变量和方法 class Student(): def __init__(self, name, age): # 构造函数 # 初始化变 ...

  6. Java复习6异常处理

    Java复习6.异常处理 20131005 前言: Java中的异常处理机制是非常强大的,相比C++ 来说,更加系统.但是我们开发人员没有很好的使用这一点.一些小的程序是没有什么问题的,但是对于大型项 ...

  7. 【lightoj-1024】Eid (高精度)

    [题意] 给定n个数,求这n个数的最小公倍数. [题解] 最小公倍数当然不能按常规方法来求,因为最大的数将近是10000^1000级别的.然鹅最小公倍数怎么搞呢? 这里发现了一个规律: 4 5 6 3 ...

  8. CF910A

    题解: 简单dp dp[i]=min(dp[i-j])+1; 代码: #include<bits/stdc++.h> using namespace std; ; int n,m,dp[N ...

  9. 获取url的hash值

    location是javascript里边管理地址栏的内置对象,比如location.href就管理页面的url,用location.href=url就可以直接将页面重定向url. 而location ...

  10. 关于Spinlock机制的一点思考

    存在两段代码同时在多核上执行的情况,这时候才需要一个真正的锁来宣告代码对资源的占有. 几个核可能会同时access临界区,这时的spinlock是如何实现的呢? 要用到CPU提供的一些特殊指令,对lo ...