一、相同点

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——一级缓存、二级缓存

    一.Mybatis缓存 ● MyBatis包含一个非常强大的查询緩存特性,它可以非常方便地定制和配置缓存.绶存可以极大的提升查询效率. ● MyBatis系统中默认定义了两级缓存:一级缓存和二级缓存 ...

  2. 配置IPv6公网地址DDNS并开放外网访问端口

    目前使用三大运营商宽带服务都会下发公网IPv6地址,这样我们想要在外网访问家里的路由.NAS等设备就可以直接通过IPv6地址来访问了.但是每次重新拨号后IPv6地址都会改变,而且IPv6的地址很长,这 ...

  3. v-for和v-if不能同时使用

    如果使用v-for遍历数据时,想筛选出URL不为空的项并进行渲染 <ul> <li v-for="(item,index) in list" v-if=" ...

  4. 面试常问的Java虚拟机内存模型，看这篇就够了！

    一.虚拟机 同样的java代码在不同平台生成的机器码肯定是不一样的,因为不同的操作系统底层的硬件指令集是不同的. 同一个java代码在windows上生成的机器码可能是0101.......,在lin ...

  5. leetcode5698.基本计算器

    给你一个整数数组 nums ,和两个整数 limit 与 goal .数组 nums 有一条重要属性:abs(nums[i]) <= limit . 返回使数组元素总和等于 goal 所需要向数 ...

  6. AI框架中图层IR的分析

    摘要:本文重点分析一下AI框架对IR有什么特殊的需求.业界有什么样的方案以及MindSpore的一些思考. 本文分享自华为云社区<MindSpore技术专栏 | AI框架中图层IR的分析> ...

  7. Kubernetes之Ingress

    在Service篇里面介绍了像集群外部的客户端公开服务的两种方法,还有另一种方法---创建Ingress资源. 定义Ingress (名词)-进入或进入的行为;进入的权利;进入的手段或地点;入口. 接 ...

  8. gitlab 设置分支保护功能及取消分支保护

      使用gitlab管理员账户登录gitlab系统 进入需要分支保护的项目 进行分支保护设置 保护开发分支策略配置 保护RC送测库分支策略配置 调整分支保护策略 效果展示 取消分支保护 效果展示

  9. 8、负载均衡HAproxy部署

    8.1.基本环境说明: 服务器名(centos7) ip地址 安装软件 slave-node1 172.16.1.91 haproxy1.8.15,tomcat8.5.37(8080.8081实例), ...

  10. AcWing 1290. 越狱

    监狱有连续编号为1~n的n个房间,每个房间关押一个犯人.有 M种宗教,每个犯人可能信仰其中一种.如果相邻房间的犯人信仰的宗教相同,就可能发生越狱.求有多少种状态可能发生越狱. #include< ...