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>運行結果：
