当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. Java Collections Source Code Series 1 --- 简介

    废话开篇 由于项目需要,需要对Java Collections进行系统地了解,所以在此记录下,方便自己,服务他人. Java Collections 简介 Java Collections 框架主要包 ...

  2. Go channel同步

    我们可以使用Channel来同步不同goroutines的执行.看下面的代码: package main import "fmt" import "time" ...

  3. MVC 初始 Log4net (一)

    以前没有使用过Log4net 插件来记录日志文件,今天研究了一下,算是有点小眉目了,只是简单的使用一下:来写一篇博客自己记录一下,希望大神们多多包涵,小伙伴多多给提些建议,相互学习,我也是初始阶段,有 ...

  4. 深入浅出TCP/IP簇

    TCP/IP是“transmission Control Protocol/Internet Protocol”的简写,中文译名为传输控制协议/互联网络协议.TCP/IP不是一个协议,而是一个协议簇的 ...

  5. 55.ERROR:Place:1136 - This design contains a global buffer instance…… non-clock load pins off chip

    ISE在布局布线时,出现下图所示错误. 对于"clock_dedicated_route”错误原因有两种情况: 1.  就是有一个时钟你没有放到全局时钟或者局部时钟的引脚,布局的时候不能把它 ...

  6. Android Jni变量对照表

    字符 Java类型 C类型 V      void            void Z       jboolean     boolean I        jint              in ...

  7. 使用xilinx ip core FIFO First- World First-Through (FWFT)模式的注意事项

    也许很多人知道xilinx ip core 中的fifo可以配成standard 模式和FWFT模式,并知道两者的区别是:standard模式下,当rd为高时,fifo会延时一个时钟输出数据(时序逻辑 ...

  8. COS中访问文件的三种方式

    1.通过FID来访问文件(比如EF,DF) 2.通过SFI来访问文件(有些COS命令可以通过SFI来快速访问文件,而不需要事先选中文件) 3.通过文件名来访问文件(只能是DF文件)

  9. 使用JavaScript+Html创建win8应用(二)

    向我们的应用中添加JavaScript 的 Windows 库控件,首先我们接着上一个demo把一个评分控件添加进来 与 HTML 控件不同的是,适用于 JavaScript 的 Windows 库控 ...

  10. Ztree的初步使用--checkbox--指定目录下搜索子节点

    这里记录一下zTree的check的使用 首先 <%@ Page Language="C#" AutoEventWireup="true" CodeBeh ...