visibility属性用来确定元素是显示还是隐藏的，这用visibility="visible|hidden"来表示（visible表示显示，hidden表示隐藏）。
当visibility被设置为"hidden"的时候，元素虽然被隐藏了，但它仍然占据它原来所在的位置。

当display被设置为block(块)时，容器中所有的元素将会被当作一个单独的块，就像<div>元素一样，它会在那个点被放入到页面中。(实际上你可以设置<span>的display:block，使其可以像<div>一样工作。

将display设置为inline，将使其行为和元素inline一样---即使它是普通的块元素如<div>，它也将会被组合成像<span>那样的输出流。

最后是display被设置：none，这时元素实际上就从页面中被移走，它下面所在的元素就会被自动跟上填。（此时应用display: none;的元素相当于消失，而visibility: hidden;则只表示隐藏，位置还在。）

javascript中 visibility和display的区别的更多相关文章

  1. js中 visibility和display的区别 js中 visibility和display的区别

    大多数人很容易将CSS属性display和visibility混淆,它们看似没有什么不同,其实它们的差别却是很大的. visibility属性用来确定元素是显示还是隐藏,这用visibility=&q ...

  2. javascript中 visibility和display区别在哪

    差异: 1.占用的空间不同. 可见性占用域空间,而显示不占用. 可见性和显示可以隐藏页面,例如: 将元素显示属性设置为block将在该元素后换行. 将元素显示属性设置为inline将消除元素换行. 将 ...

  3. JavaScript中:表达式和语句的区别

    JavaScript中:表达式和语句的区别 Javascript语言精粹:表达式是由运算符构成,并运算产生结果的语法结构.程序是由语句构成,语句则是由“:(分号)”分隔的句子或命令.如果在表达式后面加 ...

  4. Javascript中setTimeout和setInterval的区别和使用

    在javascript中,window对象有两个主要的定时方法,分别是setTimeout 和 setInterval,其语法基本上相同,但是完成的功能取有区别. setTimeout方法是定时程序, ...

  5. JavaScript 中 Property 和 Attribute 的区别详解

    property 和 attribute非常容易混淆,两个单词的中文翻译也都非常相近(property:属性,attribute:特性),但实际上,二者是不同的东西,属于不同的范畴. property ...

  6. javascript中typeof与instanceof的区别

    JavaScript 中 typeof 和 instanceof 常用来判断一个变量是否为空,或者是什么类型的.但它们之间还是有区别的: typeof typeof 是一个一元运算,放在一个运算数之前 ...

  7. javascript中基本类型和引用类型的区别分析

    大多数人系统学习过的程序设计语言,在这些语言的学习过程中最早学到的几个要点之一就是值类型和引用类型的区别.下面我们来看一下在 JavaScript 中基本数据类型(Primitive Types)和引 ...

  8. JavaScript 中表达式和语句的区别

    1.语句和表达式 JavaScript中的表达式和语句是有区别的.一个表达式会产生一个值,它可以放在任何需要一个值的地方,比如,作为一个函数调用的参数.下面的每行代码都是一个表达式: myvar3 + ...

  9. javascript 中 typeof 和 instanceof 的区别

    在 javascript 中经常会用到 typeof 和 instanceof 来判断一个对象的类型,可能 typeof 用得多些,那来看看这两个之间的区别吧. typeof : typeof 是一个 ...

随机推荐

  1. makefile编写helloworld

    相信在unix下编程的没有不知道makefile的,刚开始学习unix平台 下的东西,了解了下makefile的制作,觉得有点东西可以记录下. 下面是一个极其简单的例子: 现在我要编译一个Hello ...

  2. 【codeforces 20B】Equation

    [题目链接]:http://codeforces.com/contest/20/problem/B [题意] 给你一个方程,让你输出这个方程的解的情况. [题解] a==0,b==0,c==0时,为恒 ...

  3. 【CS round 34】Minimize Max Diff

    [题目链接]:https://csacademy.com/contest/round-34/task/minimize-max-diff/ [题意] 给你n个数字; 数组按顺序不下降; 让你删掉k个数 ...

  4. Java基础学习总结（2）——接口

    一.接口的概念 JAVA是只支持单继承的,但现实之中存在多重继承这种现象,如"金丝猴是一种动物",金丝猴从动物这个类继承,同时"金丝猴是一种值钱的东西",金丝猴 ...

  5. ie11 .pac代理脚本无法使用的问题

    参考: http://blogs.msdn.com/b/ieinternals/archive/2013/10/11/web-proxy-configuration-and-ie11-changes. ...

  6. mysql-创建和操作表

    一.建表 为了用程序创建表,我们可以使用SQL的create table 语句.如下: 每个列之间用逗号隔开,每列的定义以列名开始,后跟列的数据类型. 表的主键可以在创建表时用primary key关 ...

  7. eclipse软件快捷键的使用

    [Ct rl+T] 搜索当前接口的实现类 1. [ALT +/]    此快捷键为用户编辑的好帮手,能为用户提供内容的辅助,不要为记不全方法和属性名称犯愁,当记不全类.方法和属性的名字时,多体验一下[ ...

  8. node04---fs文件操作、静态服务器

    08fs.js var http = require("http"); var fs = require("fs"); var server = http.cr ...

  9. PHP join() 函数

    PHP join() 函数 实例 把数组元素组合为一个字符串: <?php $arr = array('Hello','World!','I','love','Shanghai!'); echo ...

  10. ES聚合底层机制-bucket深的话采用广度优先更好，而如果是年度统计还是深度优先好

    见原文,仅仅摘录部分:https://www.elastic.co/guide/cn/elasticsearch/guide/current/_preventing_combinatorial_exp ...