亚洲视频二区_亚洲欧洲日本天天堂在线观看_日韩一区二区在线观看_中文字幕不卡一区

采用css實現(xiàn)元素隱藏的方法有很多種，比如定位到屏幕之外、透明度變換等。而常見的兩種方式是將元素設(shè)置為display:none或者visibility:hidden。

元素樣式設(shè)置為display:none

當(dāng)元素樣式設(shè)置為display：none時，則該元素和它的子元素都會隱藏，不占據(jù)文檔流（就是元素原本占據(jù)的空間會釋放出來）。

給元素樣式設(shè)置display:none
<div class="a">A</div>
<div class="b">B</div>
<div class="c">C</div>

樣式設(shè)置為

.a,.b,.c{
  width:50px;
  height:50px;
  text-align:center;
  background:blue;
  margin-top:5px;
  line-height:50px;
  color:red;
}

效果如：

添加display:none后效果如下：

B原本占據(jù)的空間會釋放出來。

display的其他常見屬性值及說明

元素樣式設(shè)置為：visibility:hidden

visibility:hidden也可以將元素隱藏，但是依然顯示著元素所占據(jù)的空間。如：

給元素樣式設(shè)置visibility:none
<div class="a">A</div>
<div class="b">B</div>
<div class="c">C</div>

css樣式：

.a,.b,.c{
  width:50px;
  height:50px;
  text-align:center;
  background:blue;
  margin-top:5px;
  line-height:50px;
  color:red;
}
.b{
  visibility:hidden;
}

效果如下：

visibility的其他屬性值：