CSS隐藏元素之 visibility、display、scale

visibility: hidden 只是隐藏了内容而已，其占位空间仍然保留

div{
  visibility:hidden;
}

display: none 将元素的显示设为无，且不加载，即在网页中不占任何的位置。

div{
  display:none;
}

transform: scale(0) 可以隐藏一个元素，其占位空间仍然保存的。

div{
  transform: scale(0);
}

ps:其它还有很多隐藏元素的方法，因为很 trick 冷门，比如 height:0 ，opacity 透明度 0 等等。这里就不深入了。常见的需要注意的就是 display 是浏览器直接不会加载的，所以性能会更好，如果要彻底隐藏，就使用它即可。