css中显示div隐藏div

CSS中，可以通过设置display属性来控制元素的显示状态。其中，可以将元素的display属性设为none来隐藏元素，设为block或inline等值来显示元素。

如果想通过点击按钮或其他元素事件来切换显示状态，可以通过JavaScript来操作CSS中元素的样式，或者通过CSS中的:checked伪类来实现。下面是一个通过CSS中:checked伪类来实现点击切换显示/隐藏的示例：

 <style>
    .show {
      display: none;
    }
    
    input[type="checkbox"]:checked ~ .show {
      display: block;
    }
  </style>

  <p>点击下面的按钮来显示/隐藏内容：</p>
  <label for="toggle">
    <input type="checkbox" id="toggle"/>
    <span>显示内容</span>
  </label>
  <div class="show">
    <p>这是要隐藏/显示的内容。</p>
  </div> 

这里的CSS代码中，我们首先将显示内容的div元素的display属性设为none，即隐藏该元素。然后，通过CSS中:checked伪类来监听是否有选中状态的input。当input被选中时，我们就选中input的相邻元素div，将其display属性设为block，即显示该元素。

需要注意的是，在上面的示例中，我们使用了label元素的for属性来关联input元素，可以让用户更方便地点击到input元素，从而触发:checked伪类的监听事件。