一、相同点

disable：none和visibility：hidden都能把网页上的某元素隐藏起来

二、不同点

display：none--不为被隐藏的对象保留其物理空间，即该对象在页面上彻底消失。

visibility：hidden--使对象在页面上不可见，但页面上的空间还在。

三、举例

<!DOCTYPE html>
<html>
<head>
<meta charset="{CHARSET}">
<title>visibility：hidden和display：none的区别</title>
</head>
<body>
<div style="display: none; width: 10px;" >display</div> <a>1</a>
<div style="visibility: hidden;width: 10px;">visibility</div> <a>2</a><br />
<a>3</a>
</body>
</html>

四、效果

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

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

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

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

    大家知道,如果想让某一段代码在前台不显示,最简单的方法是用css的display:none即可,这样下边的内容就自动上移或右侧的左移来填补这个空隙. 但特殊情况下我们只需要隐藏这个元素,但它的位置不能 ...

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

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

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

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

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

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

  6. 再谈visibility:hidden和display:none

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

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

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

  8. 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 ...

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

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

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

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

随机推荐

  1. mybatis在动态 SQL 中使用了参数作为变量，必须要用 @Param 注解

    如果在动态 SQL 中使用了参数作为变量,那么就要用 @Param 注解,即使你只有一个参数.如果我们在动态 SQL 中用到了 参数作为判断条件,那么也是一定要加 @Param 注解的,例如如下方法: ...

  2. 【Android编程实战】源码级免杀_Dex动态加载技术_Metasploit安卓载荷傀儡机代码复现

    /文章作者:MG193.7 CNBLOG博客ID:ALDYS4 QQ:3496925334/ 在读者阅读本文章前,建议先阅读笔者之前写的一篇对安卓载荷的分析文章 [逆向&编程实战]Metasp ...

  3. UF_PART 部件操作

    Open C uc5000 uc5001uc5003UF_PART_add_to_recent_file_listUF_PART_apply_family_instanceUF_PART_ask_co ...

  4. 【NX二次开发】获取指定矩阵标识的矩阵值

    函数:UF_CSYS_ask_matrix_values () 函数说明:获取指定矩阵标识的矩阵值. 用法: #include <uf.h> #include <uf_csys.h& ...

  5. Python3中列表、字典、元组、集合的看法

    文首,我先强调一下我是一个弱鸡码农,这个随笔是在我学习完Python3中的元组.字典.列表,集合这四种常见数据的数据类型的一些感想,如果有什么不对的地方欢迎大家予以指正.谢谢大家啦 回归正题:这篇随笔 ...

  6. Java代码优化：使用构造函数和使用一个个setter的效率差别

    在对Java代码进行优化的时候,想方设法的要提高整体的效率,使用JProfiler看代码的时间占比,然后,看看哪些部分是可以优化的,减少运行时间的.下面有这么几个方向. 1. 能使用构造函数一步到位的 ...

  7. 入门Kubernetes - YAML文件

    前言 前篇文章中简单了解到如何把.Net Core 程序部署到k8s中,过程中使用了多个*.yaml文件,那么这些文件的格式及含义.语法是如何的呢? 接下来,进一步了解学习 一.YAML介绍: 1.简 ...

  8. 一致性hash原理 看这一篇就够了

    ​ 在了解一致性哈希算法之前,最好先了解一下缓存中的一个应用场景,了解了这个应用场景之后,再来理解一致性哈希算法,就容易多了,也更能体现出一致性哈希算法的优点,那么,我们先来描述一下这个经典的分布式缓 ...

  9. 用户RFM模型及应用

    RMF含义 R(Recency)(用户粘性,越小越好):用户最近一次交易时间的间隔.R值越大,表示用户交易发生的日期越久,反之则表示用户交易发生的日期越近 F(Frequency)(用户忠诚度,越大越 ...

  10. NuGet微软官方中国镜像地址

    https://nuget.cdn.azure.cn/v3/index.json