<!-- display:none和visible:hidden都能把网页上某个元素隐藏起来，但两者有区别: -->

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

<!-- visible:hidden 使对象在网页上不可见，但该对象在网页上所占的物理空间没有改变-->

<!-- 需要注意bootstrap中的class='hidden' 是相当于display:none 是不占物理空间的 -->

<!-- 需要注意Jquery中的hide() 是相当于display:none 是不占物理空间的 -->

<html>
<head>
<title>display:none和visible:hidden的区别</title>
</head>
<body >
<span style="display:none; 隐藏区域</span><span style=" background-color:Green">显示区域</span><br />
<span style="visibility:hidden; 隐藏区域</span><span style="background-color:Green">显示区域</span>
</body>
</html>

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

  1. CSS display:none和visibility:hidden区别

    你知道CSSdisplay:none和visibility:hidden的区别吗,这里和大家分享一下,使用CSS display:none属性后,HTML元素(对象)的宽度.高度等各种属性值都将&qu ...

  2. CSS样式“display:none”与“visibility:hidden”区别

    CSS样式“display:none”和“visibility:hidden”都可以实现将页面元素隐藏,但是具体的效果是有差别的!下面通过两个小实验来说明这种差异. 实验代码: <!DOCTYP ...

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

    display:none和visibility: hidden都能把网页上某个元素隐藏起来,但两者有区别: display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失. ...

  4. 个人收集（转载）CSS中 display:none和visibility:hidden的区别

    visibility和display两个属性都有隐藏元素的功能,display:none和visibility:hidden的区别,简单的总结一句话就是:visibility:hidden隐藏,但在浏 ...

  5. display:none;与visibility:hidden;的区别

    visibility:隐藏对应的元素但不挤占该元素原来的空间.display:隐藏对应的元素并且挤占该元素原来的空间. 下面来看visibility和dispaly的一些参数 visibility用来 ...

  6. CSS样式display:none和visibility:hidden的区别

    同样是隐藏,display:none与visibility:hidden有什么区别呢? 虽然display:none与visibility:hidden都能达到隐藏可见元素的作用(视觉上),但事实上, ...

  7. display:none和visibility:hidden的区别[]

    display:none和visibility:hidden都是把网页上某个元素隐藏起来的功能,但两者有所区别,我发现使用 visibility:hidden属性会使对象不可见,但该对象在网页所占的空 ...

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

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

  9. display:none和visibility:hidden的区别？

    css控制元素不可见的方法 { display: none; /* 不占据空间,无法点击 */ } /************************************************* ...

随机推荐

  1. VBA /VB/VB中合成分散数据方法

    公司用于项目号的合成,怕忘记,特此放上这里.若能帮助其它道友,善莫大焉. 比如:001,004,006,007,008,009,010 结果可以输出:001,004,006-010 逻辑:1.获得数据 ...

  2. Windows下MySQL5.6.21安装步骤

    01.把 mysql-advanced-5.6.17-winx64.zip 解压到自定义 D:\mysql-5.6.17-W64 或 D:\mysql-advanced-5.6.17-winx64 目 ...

  3. Spring -- 配置bean的三种方法

    配置通过静态工厂方法创建的bean public class StaticBookFactory { //静态工厂方法: public static Book getBook(String bookN ...

  4. struts2中的结果视图类型

    实际上在Struts2框架中,一个完整的结果视图配置文件应该是: <action name="Action名称" class="Action类路径" me ...

  5. 一个demo学会js

    全栈工程师开发手册 (作者:栾鹏) 快捷链接: js系列教程1-数组操作全解 js系列教程2-对象和属性全解 js系列教程3-字符串和正则全解 js系列教程4-函数与参数全解 js系列教程5-容器和算 ...

  6. iOS开发之AutoLayout中的Content Hugging Priority和 Content Compression Resistance Priority解析

    本篇博客的内容也不算太复杂,算是AutoLayout的一些高级的用法.本篇博客我们主要通过一些示例来看一下AutoLayout中的Content Hugging Priority以及Content C ...

  7. 移动端自动化自动化（Android&iOS）——Appium

    Appium-Python 移动端自动化环境搭建 Appium介绍 Appium是一个开源.跨平台的测试框架,可以用来测试原生及混合的移动端应用.Appium支持iOS.Android及Firefox ...

  8. 容器平台选型的十大模式：Docker、DC/OS、K8S 谁与当先？

    作者:刘超   来自:网易云 基础服务 无论是在社区,还是在同客户交流的过程中,总会被问到到底什么时候该用 Docker?什么时候用虚拟机?如果使用容器,应该使用哪个容器平台? 显而易见,我不会直接给 ...

  9. 62、django之MTV模型（urls,view）

    今天就进入到python最重要的阶段了django框架,框架就像胶水一样会将我们前面学的所有知识点粘合在一起,所以以前有哪些部分模糊的可以看看前面的随笔.本篇主要介绍djangoMTV模型,视图层之路 ...

  10. [译]ASP.NET Core 2.0 机密配置项

    问题 如何在ASP.NET Core 2.0中保存机密配置项(不用将其暴露给源代码管理器)? 答案 创建一个ASP.NET Core 2.0空项目,在项目节点上点击右键,并点击菜单项 - 管理用户机密 ...