CSS 可见性
visibility 属性确定元素是可见还是隐藏。
控制元素的可见性
你可以使用 visibility 属性来控制元素是否可见。此属性可以采用下表中列出的以下值之一：
| 值 | 描述 |
|---|---|
visible |
默认值。框和其内容是可见的。 |
hidden |
框及其内容不可见，但仍会影响页面的布局。 |
collapse |
此值会导致整个行或列从显示中删除。此值用于行，行组，列和列组元素。 |
inherit |
指定可见性属性的值应从父元素继承，即获取与其父元素相同的可见性值。 |
但是样式规则 visibility: collapse; 会删除内部表元素，但它不会以任何其他方式影响表的布局。通常由表格元素占据的空间将由随后的兄弟姐妹填充。
注意： 如果 visibility: collapse; 为其他元素而不是表元素指定了样式规则，则会导致与 hidden 相同的行为。
CSS 可见性与显示
CSS 的显示和可见性属性看起来是一样的，但它们实际上是完全不同的，并且经常使那些新的网页开发人员混淆。
visibility: hidden;隐藏元素，但它仍占用布局中的空间。如果隐藏框的可见性设置为可见，则它们的子元素将可见。display: none;关闭显示并从文档中完全删除元素。它不占用任何空间，即使它的 HTML 仍然在源代码中。所有子元素的显示都关闭，即使它们的display属性设置为非none的值。