[分享]css元素隐藏后显示

在CSS中，有时我们需要隐藏某些元素，但后续可能需要再次显示它们。这时，我们可以使用CSS中的display属性来实现元素的隐藏和显示。display属性决定了元素的呈现方式，常用的有以下几种：dis...

在CSS中，有时我们需要隐藏某些元素，但后续可能需要再次显示它们。这时，我们可以使用CSS中的display属性来实现元素的隐藏和显示。

display属性决定了元素的呈现方式，常用的有以下几种：

display: none; //将元素完全隐藏
display: block; //将元素作为块级元素显示
display: inline; //将元素作为行内元素显示
display: inline-block; //将元素作为行内块元素显示
display: flex; //将元素作为弹性盒子显示
display: none; //将元素完全隐藏 

为了隐藏一个元素，我们可以将其display属性设置为none：

.hide {
  display: none;
} 

这样就可以通过在页面中添加该类名来隐藏元素了。比如：

<div class="hide">
  这是需要隐藏的内容
</div> 

如果需要再次显示该元素，可以通过JavaScript来动态地修改display属性：

var element = document.querySelector('.hide');
element.style.display = 'block'; 

这样就可以将该元素显示出来了。注意，如果该元素原先的display属性是inline或者inline-block，就要将它的display属性设置为相应的值，比如inline或者inline-block。

总之，通过display属性，我们可以方便地实现元素的隐藏和显示，这在Web开发中非常实用。