定义和用法

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高质量图片浏览器源码

      下载源码   技术要点: 1. 浏览所有格式的图片 2. 图片缓存到数据库 3. Sqlite数据库的高级应用 4. 文件夹缩图显示 5. 多点触控技术 6. 动画技术 7. 支持超高清图片 8. ...

  2. 用antlr文法编写的hermit swrl规则(分享)

    /* * To change this license header, choose License Headers in Project Properties. * To change this t ...

  3. 在android的spinner中,实现取VALUE值和TEXT值

    为了实现在android的spinner实现取VALUE值和TEXT值,我尝试过好些办法,在网上查的资料,都是说修改适配器,刚开始我也是通过修改适配器的方法来做的,但是如果一个activity有多个s ...

  4. linux 常识笔记 20160621

    Linux分四部分 Linux内核 GNU工具组建 图形化桌面环境 应用软件 Linux系统的核心是内核,内核控制着计算机系统上的所有硬件和软件:必要时分配硬件,有需要时执行软件. 内核负责四项主要功 ...

  5. swift 定义类方法(type methed)

    swift   中声明结构体或者枚举的类型方法,需要在func前加上关键字 ststic  ,但是如果要定义一个类的类方法时,需要用关键字 class class SomeClass { class ...

  6. BIEE Setup

    ORACLE 出品的产品绝对都可以称得上装X神器:安装文件一定要大(小水管不让你下个三天三夜那都不叫oracle),系统内存必须得大.硬盘空间必须足够多.安装时间必须足够长.各种配置必须足够复杂.学习 ...

  7. 深入理解计算机系统第二版习题解答CSAPP 2.16

    填写下表,说明不同移位运算对单字节数的影响. x x<<3 x>>2(逻辑) x>>2(算术) 十六进制 二进制 二进制 十六进制 二进制 十六进制 二进制 十六进 ...

  8. readint writeint

    inline int readint() { char c = getchar(); while(!isdigit(c)) c = getchar(); ; while(isdigit(c)) { x ...

  9. 【译文】NginScript – 为什么我们要实现自己的JS引擎?

    在上周的nginx.conf 2015用户大会上,我们发布了全新的JavaScript引擎nginscript的预览版.历史上,JavaScript语言已经应用在许多方面,首先是作为客户端脚本,然后又 ...

  10. mount命令详解

    http://tutu.spaces.eepw.com.cn/articles/article/item/70737 挂接命令(mount) 首先,介绍一下挂接(mount)命令的使用方法,mount ...