定义和用法

visibility 属性规定元素是否可见。

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

说明

这个属性指定是否显示一个元素生成的元素框。这意味着元素仍占据其本来的空间,不过可以完全不可见。值 collapse 在表中用于从表布局中删除列或行。

默认值: visible
继承性: yes
版本: CSS2
JavaScript 语法: object.style.visibility="hidden"

实例

使 h2 元素不可见:

h2
{
visibility:hidden;
}

TIY

浏览器支持

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

注释:任何的版本的 Internet Explorer (包括 IE8)都不支持 "inherit" 和 "collapse" 属性值。

可能的值

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

TIY 实例

如何使元素不可见
本例演示如何使元素不可见。你希望元素被显示出来,还是不呢?
把表格元素设置为 collapse
本例演示如何使表格元素叠加?

相关页面

CSS 教程:CSS 定位

HTML DOM 参考手册:visibility 属性

[CSS]visibility 属性的更多相关文章

  1. CSS visibility 属性 使元素占位,但不可见

    CSS visibility 属性 使元素占位,但不可见 h2 { visibility:hidden; } 浏览器支持 所有主流浏览器都支持 visibility 属性. 注释:任何的版本的 Int ...

  2. CSS 隐藏 visibility 属性

    定义和用法 visibility 属性规定元素是否可见. 提示:即使不可见的元素也会占据页面上的空间.请使用 "display" 属性来创建不占据页面空间的不可见元素. 说明 这个 ...

  3. CSS 布局属性(display,float,clear,visibility,overflow,overflow-x,overflow-y)

    display:none | inline | block | list-item | inline-block | table | inline-table | table-caption | ta ...

  4. CSS visibility与display 属性

    所有主流浏览器都支持 visibility 属性. 注释:任何的版本的 Internet Explorer (包括 IE8)都不支持 "inherit" 和 "colla ...

  5. 关于隐藏元素高度的问题 css visibility:hidden 与 display:none的区别

    其实这是一个老问题了,s visibility:hidden 与 display:none 共同点就是都会似的元素不可见.但是 visibility:hidden 的DOM元素是占用空间的,会挤占其他 ...

  6. 详解CSS float属性(转)

    详解CSS float属性   阅读目录 基础知识 float的详细细节 float特殊情况 clear属性 清除浮动 float的应用 总结 CSS中的float属性是一个频繁用到的属性,对于初学者 ...

  7. Android笔记——Android中visibility属性VISIBLE、INVISIBLE、GONE的区别

    在Android开发中,大部分控件都有visibility这个属性,其属性有3个分别为"visible "."invisible"."gone&quo ...

  8. CSS will-change 属性

    介绍 如果你注意到在webkit的浏览器上“flicker”一些CSS操作(尤其是变形和动画方面的)的表现,你很可能之前就注意过硬件加速了 CPU.GPU和硬件加速 硬件加速意味着Graphics P ...

  9. css动画属性性能

    性能主要表现:流量.功耗与流畅度 在现有的前端动画体系中,通常有两种模式:JS动画与CSS3动画. JS动画是通过JS动态改写样式实现动画能力的一种方案,在PC端兼容低端浏览器中不失为一种推荐方案. ...

随机推荐

  1. Android GridView 添加 网格线解决办法

    在使用 GridView 网格布局时,默认情况下 GridView  是没有网格线的,但是有些时候我们需要让GridView显示分割线,怎么办呢?查了不少资料,找到了一种为GridView添加网格线的 ...

  2. sphinx配置文件继承

    # # Minimal Sphinx configuration sample (clean, simple, functional) # source mysql { type = mysql #数 ...

  3. (转)Dependency Walker使用说明

    在Windows世界中,有无数块活动的大陆,它们都有一个共同的名字——动态链接库.现在就让我们走进这些神奇的活动大陆,找出它们隐藏已久的秘密吧! 初窥门径:Windows的基石 随便打开一个系统目录, ...

  4. 运维知识体系v0.5

    http://www.90qj.com/?post=318http://ixdba.blog.51cto.com/2895551/1751377   运维知识体系v0.5-(运维社区-赵班长出品,欢迎 ...

  5. java_类泛型承继方法

    package ming; class Apple3<T>{ private T info; public Apple3(){} public Apple3(T info){ this.i ...

  6. 手把手教你使用UICollectionView写公司的项目

    在很多app中都有这样通用的页面,一直没有机会使用UICollectionView,只是简单的看过他的使用方法.今天公司美工出图,使用了他,并且遇到了好多的坑.记录一下过程,不确定使用的方法是不是最优 ...

  7. MySQL(5):数据表操作

    表名的前缀: 两个student表,为了区分相同逻辑表名的不同应用,给逻辑表名,增加前缀 //学生管理 create table info_student ( name varchar(20), st ...

  8. 焦点轮播图——myfocus焦点图库

    网站网址: http://demo.jb51.net/js/myfocus/demo.html 简单3步,你即可以用上myFocus. Step 1. 在html的标签内引入相关文件 <scri ...

  9. JavaScript高级程序设计(第三版)学习笔记1~5章

    第2章,在html中使用JavaScript Html引入外部js脚本 <script type="text/javascript" src="test.js&qu ...

  10. PHP基础1

    PHP:相当于客户端和MySQL之间的一堵墙 Apache(阿帕奇):是web服务器软件 localhost:相当于一个域名   一.wampserver http.conf:用来配置Apache p ...