如何创建不创建换行符或水平空间的隐藏 div？

Question

我想要一个不占用屏幕任何空间的隐藏复选框。

如果我有这个：

 <div id="divCheckbox" style="visibility: hidden">

我没有看到复选框，但它仍然会创建一个新行。

如果我有这个：

 <div id="divCheckbox" style="visibility: hidden; display:inline;">

它不再创建新行，但会占用屏幕上的水平空间。

有没有办法让隐藏的 div 不占用空间（垂直或水平？

原文由 leora 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

使用 display:none;

 <div id="divCheckbox" style="display: none;">

• visibility: hidden 隐藏元素，但它仍然占用布局空间。

• display: none 从文档中完全删除元素，它不占用任何空间。

原文由 Christian C. Salvadó 发布，翻译遵循 CC BY-SA 2.5 许可协议

Answer 2

自从 HTML5 发布以来，现在可以简单地做到：

 <div hidden>This div is hidden</div>

注意： 某些旧浏览器不 支持 此功能，尤其是 IE < 11。

隐藏 属性文档 ( MDN , W3C )

原文由 C_B 发布，翻译遵循 CC BY-SA 4.0 许可协议