【发布时间】：2019-05-18 22:07:32
【问题描述】：
我知道使用visibility:hidden 会保留页面上的空间，而display:none 不会，但是，什么时候“保留”空间才有意义？这可能会在页面上留下一个尴尬的空白区域/大洞。
【问题讨论】：
标签： html dynamic static visibility display
【发布时间】：2019-05-18 22:07:32
【问题描述】：
Display:none - Dynamic Pages/Sections：通常将此用于页面上较大的动态区域，以避免留下尴尬的空白区域，使页面看起来很糟糕。显示时，它将移动页面的其他部分并在其设计的页面中呈现自身，根据需要/设计改变周围页面元素的位置和流动。
Visibility:hidden - Static Pages/Sections：将此用于较小的部分，当该部分变得可见时，周围元素移动是不希望的，即：在页面部分显示/隐藏徽章。使用 display:none 可以/将强制自己进入页面部分并移动其周围元素为自己腾出空间，从而导致页面移动。在这种情况下使用 visibility:hidden 将隐藏/显示“徽章”元素，而不会移动其他周围的页面元素，因为该空间已为其“保留/保留”，因此，它只是“打开/关闭它” “没有任何可见的运动。
由于此用法是在“静态”页面部分的一小部分上，因此页面中的空白“孔”由于“保留/保留”空间而在隐藏时不明显，因为页面的“布局”不依赖于徽章的小“保留/保留”空间。它只是较大静态区域中的一小部分。
希望这有助于决定何时/何地使用这两个看似相似的属性。
【讨论】：