CSS 中的 visibility 属性用来设置元素是否可见，您可以将该属性与 JavaScript 一起使用，来创建非常复杂的菜单或网页布局，比如在网页中做一些测试题时您可以使用 visibility 属性将题目的答案或解析隐藏起来，需要时再将其展示出来。
visibility 属性的可选值如下：
举例说明：
1. visible
可见的（默认的）使用方法
由于默认属性值是显示。所以三个小盒子都显示。
<!DOCTYPEhtml><html><head><metacharset=UTF-8><metaname=viewportcontent=width=device-width,initial-scale=1.0><title>Document</title><style>div{width:100px;height:100px;}.one{background-color:palegreen;}.two{background-color:palevioletred;}.three{background-color:papayawhip;}</style></head><body><div></div><div></div><div></div></body></html>运行结果：
2.hidden
当我们给第一个小盒子设置成不显示（visibility: hidden;）时，第二个小盒子依旧占有原来的位置。
<!DOCTYPEhtml><html><head><metacharset=UTF-8><metaname=viewportcontent=width=device-width,initial-scale=1.0><title>Document</title><style>div{width:100px;height:100px;}.one{background-color:palegreen;visibility:hidden;}.two{background-color:palevioletred;}.three{background-color:papayawhip;}</style></head><body><div></div><div></div><div></div></body></html>运行结果：
注意：visibility隐藏元素后，继续占有原来位置。
如果隐藏元素想要原来位置，就用visibility：hidden
如果隐藏元素不想要原来位置，就用display：none
3.inherit
举例：
<!DOCTYPEhtml><html><head><metacharset=UTF-8><metaname=viewportcontent=width=device-width,initial-scale=1.0><title>Document</title><style>.one,.two,.three{width:100px;height:100px;}.one{background-color:palegreen;}.two{background-color:palevioletred;}.three{background-color:papayawhip;}.four,.five{width:50px;height:50px;background-color:powderblue;}</style></head><body><div><div></div></div><div><div></div></div><div></div></body></html>运行结果：
当使用inherit属性值时。
（1）由于给第一个绿色大盒子设置了不显示，所以，第一个盒子里的蓝色小盒子继承了大盒子hidden属性，也不显示。
（2）第二个蓝色小盒子继承了粉色的大盒子的显示默认属性visible，所以显示。
<!DOCTYPEhtml><html><head><metacharset=UTF-8><metaname=viewportcontent=width=device-width,initial-scale=1.0><title>Document</title><style>.one,.two,.three{width:100px;height:100px;}.one{background-color:palegreen;visibility:hidden;}.two{background-color:palevioletred;}.three{background-color:papayawhip;}.four,.five{width:50px;height:50px;background-color:powderblue;}</style></head><body><div><div></div></div><div><div></div></div><div></div></body></html>运行结果：
