visibility
visibility 属性有两种用法：取值为 hidden 时隐藏元素，并将其所占空间用空白占位。取值为 collapse 时隐藏表格的一行或一列。
语法
visibility: visible visibility: hidden visibility: collapse
值
| 值 | 描述 |
|---|---|
| visible | 此关键词表示元素正常显示。 |
| hidden | 此关键词用于隐藏元素，其他元素的布局不改变，相当于使用此属性的元素编程透明。另外如果将其子元素设为visibility: visible，则该子元素依然可见。 |
| collapse | 此关键词用于表格行、列、列组和行组，隐藏表格的行或列，并且不占用任何空间(与将 display: none 用于表格的行/列上的效果相当）。但是其他行与列的宽和高不会重新计算，行与列的宽高计算依然会将被设为 collapse 的行和列考虑进去。这是用于快速从表格中删除一行或一列，而无需重新计算表格其他元素的宽和高。（用于其他元素时，collapse 效果与 hidden 相同。) |
例子
HTML
<div id="red"> </div> <div id="orange"> </div> <div id="green"> </div>
CSS
#red {
width: 200px;
height: 50px;
background: red;
}
#orange {
width: 200px;
height: 50px;
background: orange;
visibility: hidden;
}
#green {
width: 200px;
height: 50px;
background: green;
}
执行结果