`

元素显示 visibility与display的差别

    博客分类:
  • Web
 
阅读更多

     div的visibility可以控制div的显示和隐藏,但是隐藏后页面显示空白:

  style="visibility: none;"

  document.getElementById("typediv1").style.visibility="hidden";//隐藏

  document.getElementById("typediv1").style.visibility="visible";//显示

  通过设置display属性可以使div隐藏后释放占用的页面空间,如下

  style="display: none;"

  document.getElementById("typediv1").style.display="none";//隐藏

  document.getElementById("typediv1").style.display="";//显

分享到:
评论

相关推荐

    通过display或visibility来实现HTML元素的显示与隐藏

    需要根据某些条件来控制Web页面中的HTML元素显示还是隐藏,可以通过display或visibility来实现,感兴趣的朋友可以了解下本

    JS中style.display和style.visibility的区别实例说明

    在JS中可以通过设置style.display或者style.visibility属性来控制元素是否显示,在style.display=block和style.visibility=visible的时候,元素被显示,在style.display=none和style.visibility=hidden的时候,元素...

    CSS Display与Visibility的不同

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

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

    .imgbox { float:left; text-align:center; width:120px; height:135px; border:1px solid gray;...CSS Display(显示) 与 ...display属性设置一个元素应如何显示,visibility属性指定一个元素应可见还是隐藏。 Box 1 Box

    JAVASCRIPT style 中visibility和display之间的区别

    visibility属性用来确定元素是显示还是隐藏的,这用visibility="visible|hidden"来表示(visible表示显示,hidden表示隐藏)。

    通过display或visibility来隐藏html元素

    有些时候我们需要根据某些条件来控制Web页面中的HTML元素显示还是隐藏,可以通过display或visibility来实现。通过下面的例子了解display和visibility的区别,简单的例子代码如下: 复制代码代码如下: <html> ...

    CSS属性中Display与Visibility区别分析

    visibility属性用来确定元素是显示还是隐藏,这用visibility="visible|hidden"来表示, visible表示显示, hidden表示(仅)隐藏,不可恢复。 当visibility被设置为"hidden"的时候,元素虽然被隐藏了, 1、仍然...

    详解css中的display属性

    inlineblockinline-blocknone把 display 设置成 none 不会保留元素本该显示的空间,但是 visibility: hidden 还会保留。 那么,display:inline、display:block和display:inline-block有什么区别呢? 复制代码代码...

    JS控制HTML元素的显示和隐藏的两种方法

    利用来JS控制页面控件显示和隐藏有两种方法,两种方法分别利用HTML的style中的两个属性,两种方法的不同之处在于控件隐藏后是否还在页面上占空位。...document.getElementById("EleId").style.display="none"; do

    jQuery可见性过滤器:hidden和:visibility用法实例

    匹配所有不可见元素,如果使用css的visibility属性让元素不显示但是占位,则不属于hidden了 查找display:none的tr元素,$(“tr:hidden”) :visible 匹配所有可见元素 查找所有display不为none的元素,$(“tr:visible...

    CSS控制DIV层显示和隐藏的实现方法

    css中display和visibility可以隐藏和显示html元素包括DIV层。看起来两者非常类似,很多人会搞混。下面分别介绍两者的属性: display:none|block; display:none; 隐藏该html元素,确切的说,是在浏览器中消除该元素,...

    div+css有实例,易学易懂

    5.7.4 控制内容显示的visibility 属性 5.7.5 使用text-align 属性的水平居中 5.7.6 使用margin 属性的水平居中 5.8 浮动属性 5.8.1 浮动属性详解 5.8.2 相邻的浮动元素和固定元素 5.8.3 相邻的两个浮动元素 5.8.4 ...

    CSS相对,绝对,固定,静态定位和显示效果——每天一遍小知识

    是否显示——visibility三.定位——position1.基本概念2.静态定位——static3.固定定位——Fixed Positioning4.相对定位——Relative Position5. 绝对定位——Absolute Position6.自我总结,代码效果 一.显示属性...

    Javascript 个人笔记(没有整理,很乱)

    ==============关于元素的显示和隐藏============= Visibility快于Display 让图画时隐时现会创造很有趣的效果,有2种方法可以实现这个目的:使用CSS的visibility属性或者 display属性。对于绝对位置元素,diaplay和...

    interview:面试

    1.浏览器渲染过程2....CSS 4.display除了这几个值还有哪些 dispaly:flex; 5.display:none 让元素隐藏 display:none和visibility:hidden的区别 ... 将元素显示设为无 空间释放 各种属性丢失 opacity的兼容处理

    举例讲解jQuery中可见性过滤选择器的使用

    可见性过滤器 可见性过滤器根据元素的可见性和不可见性来选择相应的元素。...注意::hidden 过滤器一般是包含的内容为:CSS 样式为display:none、input 表单类型为type=”hidden”和visibility:hid

    js无法获取到html标签的属性的解决方法

    之前我就纳闷了,visibility为什么可以实现div的隐藏和显示而display不可以,我明明记得以前可以的,原来是我在style的属性里面给它写的是visibility,没有写display,而以前写的是display <%@ page ...

Global site tag (gtag.js) - Google Analytics