当visibility被设置为"hidden"的时候,元素虽然被隐藏了,但它仍然占据它原来所在的位置。注意,当元素被隐藏之后,就不能再接收到其它事件了。
display属性就有一点不同了。visibility属性是隐藏元素但保持元素的浮动位置,而display实际上是设置元素的浮动特征。

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

将display设置为inline,将使其行为和元素inline一样---即使它是普通的块元素如<div>,它也将会被组合成像<span>那样的输出流。
最后是display被设置:none,这时元素实际上就从页面中被移走,它下面所在的元素就会被自动跟上填。(此时应用display: none;的元素相当于消失,而visibility: hidden;则只表示隐藏,位置还在。)

css display visibility的更多相关文章

  1. [转]CSS Display(显示) 与 Visibility(可见性)

    CSS Display(显示) 与 Visibility(可见性) display属性设置一个元素应如何显示,visibility属性指定一个元素应可见还是隐藏. 隐藏元素 - display:non ...

  2. CSS Display(显示) 与 Visibility(可见性)

    display属性设置一个元素应如何显示,visibility属性指定一个元素应可见还是隐藏. Box 1 Box 2 Box 3 隐藏元素 - display:none或visibility:hid ...

  3. CSS Display(显示)和Visibility(可见性)

    CSS Display(显示)和Visibility(可见性) 一.简介 display属性设置一个元素应如何显示(隐藏不占用空间),visibility属性指定一个元素应可见还是隐藏(隐藏占用空间) ...

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

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

  5. CSS:CSS Display(显示) 与 Visibility(可见性)

    ylbtech-CSS:CSS Display(显示) 与 Visibility(可见性) 1.返回顶部 1. CSS Display(显示) 与 Visibility(可见性) display属性设 ...

  6. python+selenium:解决上传文件<input type='file'>标签属性被css的visibility隐藏导致无法定位元素的问题

    要想上传文件,需要找到在HTML中<input type="file" />这个标签,有它就可以利用send_keys上传文件,不过这里的<input>元素 ...

  7. CSS——display(Block none inline等)属性的用法

    在一般的CSS布局制作时候,我们常常会用到display对应值有block.none.inline这三个值.下面我们来分别来认识和学习什么时候用什么值.这里通过CSS display知识加实例.图演示 ...

  8. CSS display:inline-block

    CSS display:inline-block 在css布局里,我们经常看到代码 「display:inline-block; *display:inline; zoom:1; 」,大多人会说上面的 ...

  9. CSS display:inline和float:left两者区别探讨

     本文和大家重点讨论一下CSS display:inline和float:left两者的区别,CSS display是指显示状态,inline表示内联,特点是紧贴着前一个内联元素,通常默认的内联元素有 ...

随机推荐

  1. Map,HashMap

    Map(映射),又称为字典(Dictionary),是由关键字(Key)及其对应的元素值(Value)所组成的元素单元(Element)的表单式集合. 通常,对于Map而言,使用给定的Key,可以迅速 ...

  2. EntityFramwork(1) 源地址https://msdn.microsoft.com/zh-cn/data/jj193542

    1.创建应用程序 简单起见,我们将构建一个使用 Code First 执行数据访问的基本控制台应用程序. 打开 Visual Studio "文件"->"新建&qu ...

  3. Python实现kNN(k邻近算法)

    Python实现kNN(k邻近算法) 运行环境 Pyhton3 numpy科学计算模块 计算过程 st=>start: 开始 op1=>operation: 读入数据 op2=>op ...

  4. OC学习笔记之属性详解和易错点

    属性的概念在OC1.0中就存在,格式是定义实例变量,然后定义setter和getter方法,用点操作符操作属性 举例,类的接口部分 @interface Father : NSObject { NSI ...

  5. color the python console text

    //install termcolor module cd \ cd python27 cd scripts pip install termcolor pip install colorama // ...

  6. 用MSBuild和Jenkins搭建持续集成环境(1)

     http://www.infoq.com/cn/articles/MSBuild-1 你或其他人刚刚写完了一段代码,提交到项目的版本仓库里面.但等一下,如果新提交的代码把构建搞坏了怎么办?万一出现编 ...

  7. WEB相关文件的加载顺序

    一. 1.启动一个WEB项目,WEB容器会先去读取它的配置文件web.xml,读取<context-param>和<listener>两个节点. 2.接着,容器创建一个Serv ...

  8. 刷机总结(阿里云os-->android4.2.2)注明:本文不是教程

    注明:本文不是教程 写这篇文章的目的:让准备刷机的人(无论你是小白还是老鸟,当然老鸟就不用看了)用最短的时间了解刷机过程 其实本来目的是准备将阿里云的2.3.7升级到3.0的,但是3.0没有针对基伍大 ...

  9. 三门概率问题之C#版

    前言: 早上看到一片关于三门问题的博客http://www.cnblogs.com/twocats/p/3440398.html,抱着该博客结论的怀疑态度用C#语言写了一些代码.实验证明该博客的结论是 ...

  10. fwrite ,fprintf的作用与区别

    1.概念和作用 fwrite是C语言函数,指向文件写入一个数据块,写入的是 fprintf是C/C++中的一个格式化写-库函数,其作用是格式输出到一个流/文件中:原型是int fprintf( FIL ...