`
ahut9923
  • 浏览: 233722 次
  • 性别: Icon_minigender_1
  • 来自: 安徽
社区版块
存档分类
最新评论

div的visibility和display属性区别

阅读更多

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="";//显示 



Trackback: http://tb.blog.csdn.net/TrackBack.aspx?PostId=1675453

分享到:
评论

相关推荐

    display和visibility的区别示例介绍

    display通常可以设置为none、inline、block visibility通常可以设置为hidden、visible 当display为none,visibility为hidden时,元素都会不见。不过其还有不同之处。 display会将元素隐藏掉,并且位置不再被占据,而...

    区别div和span、relative和absolute、display和visibility

    div和span、relative和absolute、display和visibility是很容易混淆和弄错的HTML标签与CSS属性,今天52CSS.com简单的罗列出它们的区别与使用要点,供大家参考。

    css中display和visibility的用法和区别介绍

    Display的属性值 block:/*表现为一个块级元素(一般情况下独占一行)*/当display被设置为block(块)时,容器中所有的元素将会被当作一个单独的块,就像<DIV>元素一样,它会在那个点被放入到页面中。(实际上你可以...

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

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

    display和visibility的区别

    visibility隐藏的对象还保留对象显示时所占的物理空间,display则不保留。 vilibility:hidden(隐藏)、visible(显示) style="vislbility:hidden" display:none(隐藏)、block(显示) style="display:none" 可以保存...

    JAVASCRIPT style 中visibility和display之间的区别

    当visibility被设置为”hidden”的时候,元素虽然被隐藏了,但它仍然占据它原来所在的位置。 ————————————————————— 例子: 代码如下: [removed] function ...div onclick=”toggleVisibility(th

    通过display或visibility来隐藏html元素

    通过下面的例子了解display和visibility的区别,简单的例子代码如下: 复制代码代码如下: <html> <head> <title>HTML元素的显示与隐藏控制</title> [removed] function showAndHidden1(){ ...

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

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

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

    通过下面的例子了解display和visibility的区别,简单的例子代码如下: 复制代码代码如下: <html> <head> <title>HTML元素的显示与隐藏控制</title> [removed] function showAndHidden1(){ ...

    JQuery显示、隐藏div的几种方法简明总结

    通过设置display属性可以使div隐藏后释放占用的页面空间. style=”display: none;” document.getElementById(“demo”).style.display=”none”;//隐藏 document.getElementById(“demo”).style.display=””;//...

    div+css有实例,易学易懂

    2.3.2 元素的书写格式和属性 2.3.3 各种元素的属性 2.4 XHTML 代码规范 第 3 章 CSS 基础与书写规范 第29 页 3.1 CSS 的基础知识 3.1.1 什么是CSS 3.1.2 CSS 的语法 3.1.3 选择符 3.1.4 属性 3.1.5 伪类和伪元素 ...

    跨年烟花代码,兔年吉祥,大吉大利~

    <div style="display:none"> <div class="shape">兔年吉祥</div> <div class="shape">突飞猛进</div> <div class="shape">阖家幸福</div> <div class="shape">万事如意</div> <div class="shape">心想事成</...

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

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

    跨年烟花代码html 可修改

    <div style="display:none"> <div class="shape">2023新年快乐</div> <div class="shape">虎岁扬威兴骏业</div> <div class="shape">兔毫着彩绘宏图</div> <div class="shape">ヾ(^∀^)ノ</div> </div> ...

    零基础学HTML CSS源代码

    DIV与SPAN区别一.html 演示DIV与SPAN区别一。 DIV与SPAN区别二.html 演示DIV与SPAN区别二。 DIV与SPAN实例手把手--布局.html 演示DIV与SPAN实例手把手--布局。 第14章(源代码\第14章) 示例描述:本章...

    DIV CSS布局浏览器兼容的问题

    刚学css div布局,总会遇到很多浏览器兼容的问题,这个问题困扰了一段时间,只到看了精通css才看到几个解决办法。 1.加clear空div .clearfix:after { content: .; display: block; height: 0; clear: both; ...

    JS中使用 after 伪类清除浮动实例

    <div xss=removed></div> 或者写在br标签里面来解决,但这样会增加无语义的标签,下面是用after伪类实现,兼容多种浏览器 .clearfix:after{ content:; display:block; height:0; clear:both; visibility:...

    div+css通用兼容性代码整理

    一、Div+css通用兼容性代码 你可以在css开头加入 *html{padding:0px} 复制代码代码如下: <style> *html{padding:0px} /* Clear Fix */ .clearfix:after { content:”.”; display:block; height:0; clear:...

Global site tag (gtag.js) - Google Analytics