CSS中的display属性可以控制一个元素在页面上的可见性和布局方式。其中，其中一个很常用的值就是“none”，用于将元素隐藏起来。下面我们来详细了解一下它的用法。

.hide {
display: none;
}

上述代码可以将拥有hide类名的元素隐藏起来，这意味着不仅它在页面上不可见，而且它所占的空间也会被释放出来。这通常用来在某些条件下隐藏一些元素，或者通过JavaScript操作来控制元素的显示和隐藏。

然而，在某些情况下，我们希望隐藏元素但又不希望失去它所占的空间，这时候可以使用“visibility:hidden”属性。虽然元素不可见，但所占的空间仍然存在。

.hide {
visibility: hidden;
}

需要注意的是，不同于“display: none”会将元素完全从渲染树中移除，在使用“visibility:hidden”后，元素仍然会被渲染并占据其指定位置，但它是不可见的。

在实际应用中，我们可以将隐藏的元素设置为不可见，通过JavaScript动态修改样式实现元素的显示和隐藏，这样实现复杂动画效果时效果更佳。