style="visibility:hidden": 使对象在网页上隐藏,但该对象在网页上所占的空间没有改变.
　　style="display:none": 使对象在网页上彻底消失,不为被隐藏的对象保留物理空间.

　　实际举例如下:

 <html>

   <head>

   <title>style="visibility:hidden"与style="display:none"的区别</title>

   </head>

   <body>

     <span style="visibility:hidden; background-color:Blue">隐藏区域</span><span style="background-color:Green">显示区域</span>

     <span style="display:none; background-color:Blue">隐藏区域</span><span style="background-color:Green">显示区域</span><br/>

   </body>

 </html>

转：http://blog.csdn.net/maxracer/article/details/6711586

Html style="visibility:hidden"与style="display:none"的区别的更多相关文章

  1. style="visibility: hidden" 和 style=“display:none”区别

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

  2. style="visibility: hidden"和 style=“display:none”之间的区别

    style=“display:none” 隐藏页面元素: <html> <head> <script type="text/javascript"&g ...

  3. JS中style.display和style.visibility的区别

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

  4. CSS样式“display:none”与“visibility:hidden”区别

    CSS样式“display:none”和“visibility:hidden”都可以实现将页面元素隐藏,但是具体的效果是有差别的!下面通过两个小实验来说明这种差异. 实验代码: <!DOCTYP ...

  5. 个人收集（转载）CSS中 display:none和visibility:hidden的区别

    visibility和display两个属性都有隐藏元素的功能,display:none和visibility:hidden的区别,简单的总结一句话就是:visibility:hidden隐藏,但在浏 ...

  6. [HTML/CSS]display:none和visibility:hidden的区别

    写在前面 在群里有朋友问这样一个问题,display:none的标签,影响了布局.这就引出了本篇这样的问题,印象中display:none的块元素是不占位置的. 一个例子 <!DOCTYPE h ...

  7. display:none和visibility:hidden区别

    <!-- display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别: --> <!-- display:none 不为被隐藏的对象保留其物理空 ...

  8. display:none和visibility:hidden两者的区别

    display与元素的隐藏 如果给一个元素设置了display: none,那么该元素以及它的所有后代元素都会隐藏,它是前端开发人员使用频率最高的一种隐藏方式.隐藏后的元素无法点击,无法使用屏幕阅读器 ...

  9. display：none和visibility:hidden

    w3school学习网:https://www.w3school.com.cn/tiy/t.asp?f=hdom_style_display_none display: none----将元素的显示设 ...

随机推荐

  1. petrozavodsk1

    A 转化模型和相当于求解小于n/2的最大的和n互质的数字, 显然可以证明所求和n/2相距 O(logn) ,从 n/2 开始向下枚举然后判定即可. B 上下界网络流? C 从底层开始向上走贪心选下层节 ...

  2. iview之select选择框选中内容后有空格的问题

    导致原因: option组件格式化造成的.此处</Option>在另一行,只要和输出内容一行,就不会有空格了. <Select :label-in-value="true& ...

  3. 面试问题 ---C#中的委托

    一.C#委托是什么的? 在正式介绍委托之前,我想下看看生活中委托的例子——生活中,如果如果我们需要打官司,在法庭上是由律师为我们辩护的,然而律师真真执行的是当事人的陈词,这时候律师就是一个委托对象,当 ...

  4. 结对项目-ExamGeneration-四则运算试题生成与计算程序

    目录 ExamGeneration 进展 功能 调用示例 PSP表格 结对分工 功能模块详解 Chernobyl: -Gaveu: 运行测试 -Gaveu: Chernobyl: 项目总结与反思 Ch ...

  5. public,protect,private访问权限

    第一:private, public, protected 访问标号的访问范围. private:只能由1.该类中的函数.2.其友元函数访问.不能被任何其他访问,该类的对象也不能访问. protect ...

  6. 给Fitnesse添加调用多参数fixture的调用方法

    修改文件:fitnesse.slim.fixtureInteraction.DefaultInteraction.java 修改如下三处内容: (注意只支持仅含有一个参数,且该参数是多参数的fixtu ...

  7. python3 Flask安装

    虚拟环境 建议在开发环境和生产环境下都使用虚拟环境来管理项目的依赖. 为什么要使用虚拟环境?随着你的 Python 项目越来越多,你会发现不同的项目会需要 不同的版本的 Python 库.同一个 Py ...

  8. python中的三元表达式（三目运算符）

    python中没有其他语言中的三元表达式,不过有类似的实现方法 其他语言中,例如java的三元表达式是这样 int a = 1; String b = ""; b = a > ...

  9. Python爬虫之设置selenium webdriver等待

    Python爬虫之设置selenium webdriver等待 ajax技术出现使异步加载方式呈现数据的网站越来越多,当浏览器在加载页面时,页面上的元素可能并不是同时被加载完成,这给定位元素的定位增加 ...

  10. easyui的datagrid用js插入数据等编辑功能的实现

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...