查看“Pr class visibility”的源代码

{{DISPLAYTITLE:visibility}}[[Category:css reference|170]]
= CSS visibility 属性 =

使 &lt;h2&gt; 元素不可见：

<sample title="" desc="" lang="html" hererun="1">

    h2

    {

    visibility:hidden;

    }

 </sample>
<run name=""> <!DOCTYPE html>
<html>
<head>
<style>
h1.visible {visibility:visible}
h1.hidden {visibility:hidden}
</style>
</head>

<body>
<h1 class="visible">This is a visible heading</h1>
<h1 class="hidden">This is an invisible heading</h1>
<p>Notice that the invisible heading still takes up space.</p>
</body>

</html>
 </run>
在此页底部有更多的例子。

== 属性定义及使用说明 ==

visibility属性指定一个元素是否是可见的。

'''提示:'''即使不可见的元素也会占据页面上的空间。请使用 &quot;display&quot; 属性来创建不占据页面空间的不可见元素。

{| class="table table-striped table-hover"
| 默认值：
| visible
|-
| 继承：
| yes
|-
| 版本：
| CSS2
|-
| JavaScript 语法：
| object.style.visibility=&quot;hidden&quot;
|}

== 浏览器支持 ==

所有主流浏览器都支持visibility属性。

'''注意：''' ：Internet Explorer（包括IE8）没有版本支持属性值&quot;inherit&quot;或&quot;collapse&quot;。

== 属性值 ==

{| class="table table-striped table-hover"
! 值
! 描述
|-
| visible
| 默认值。元素是可见的。
|-
| hidden
| 元素是不可见的。
|-
| collapse
| 当在表格元素中使用时，此值可删除一行或一列，但是它不会影响表格的布局。被行或列占据的空间会留给其他内容使用。如果此值被用在其他的元素上，会呈现为 &quot;hidden&quot;。
|-
| inherit
| 规定应该从父元素继承 visibility 属性的值。
|}

== 更多实例 ==

[[try.php?filename=trycss_visibility_collapse|把表格元素设置为collapse]] 本例演示如何使表格元素叠加。

== 相关文章 ==

CSS 教程: [[css display visibility|CSS Display 和 visibility]]