在隱藏元素時保留頁面佈局

當旨在隱藏HTML 元素而不影響視覺佈局時，使用Visibility: hide 可能會導致導致不良結果。在視圖中隱藏元素時，它繼續佔據頁面上的相同空間。

停用顯示

要克服這個挑戰，建議使用 display 屬性。透過將元素的顯示設為 none，它實際上會從視覺表示中消失，就好像它已完全從 DOM 中刪除一樣。

考慮以下範例：

最初，div元素正常顯示。隱藏它：
#element {
  display: none;
}
當應用 display: none 時，該元素在視覺上變得不存在，從而釋放其先前佔用的空間。恢復元素的可見性：
#element {
  display: block;  
}
使用顯示的好處：無
保留頁面佈局
維持元素在HTML 程式碼中的位置
透過設定display:block
可以讓元素輕鬆再次顯示