仅使用CSS隐藏Div [英] Hide A Div With CSS Only

问题描述

是否只有在单击链接时才可以使用CSS隐藏div。我正在制作一个弹出窗口，该弹出窗口需要没有JS时才能关闭。我尝试了各种方法，但是当按钮位于需要隐藏的div内时，它们却无法使用。

Is there a way to hide a div with css only when you click a link. I'm making a popup that needs to be able to close when there is no JS. I've tried various methods but they have not worked when the button is inside the div that needs to hide.

推荐答案

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

when the button is inside the div that needs to hide.

简短回答：否，当按钮位于元素内部时，您无法实现此目的。 ^{感谢 Joseph Marikle}

但是，您

#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>

这篇关于仅使用CSS隐藏Div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！