仅使用CSS隐藏Div

Question

有没有办法只在单击链接时用css隐藏div.我正在创建一个需要能够在没有JS时关闭的弹出窗口.我已经尝试了各种方法但是当按钮位于需要隐藏的div内时它们没有工作.

Answer 1

当按钮位于需要隐藏的div内时.

简答:不,当按钮位于元素内部时,您无法实现此目的. ^{谢谢Joseph Marikle}

但是,当按钮位于div之外时,您可以实现此目的.

#hide {
  display: none;
}
label {
  cursor: pointer;
  text-decoration: underline;
}
#hide:checked ~ #randomDiv {
  display: none;
}

<input type="checkbox" id="hide" />


<div id="randomDiv">
  This is a div
  <label for="hide">Hide div</label>
</div>