css中display和visibility的用法和区别介绍

而当display设置为none时，元素将从页面中完全移除，就像它从未存在过一样，其原本占据的空间将被其他元素填补。该元素的宽度、高度等各种属性值都将“丢失”。

接下来，我们来看看visibility属性。

visibility的可见性设置主要包括以下几种：

visible：默认值，元素可见。

hidden：元素不可见，但会保留其原本的空间位置，也就是说，它仍然占据页面上的空间，只是用户无法看到。它的宽度、高度等属性值仍然存在。

inherit：继承上级元素的visibility值。

display和visibility两个属性虽然都能让元素不可见，但它们的作用方式有所不同。display:none会让元素完全从页面中消失，不再占据任何空间；而visibility:hidden则是让元素视觉上不可见，但其空间位置仍然保留。了解这两个属性的区别并合理使用，将有助于我们更精细地控制网页元素的展现和布局。

由Cambrian渲染引擎处理并呈现。如有更多疑问或需求，请随时联系我们的技术支持团队。