隐藏的HTML元素占用空间

Question

我想制作一些空的隐藏元素（iframe会很好，段落会这样做）Javascript稍后会填充和修改。我无法弄清楚如何防止这些元素占用空间。我已经关闭了边距和填充，并将高度设置为零，但最终还是留有空白。

我想看一个隐藏元素的例子，它不会在页面上占用空间。实际上，我想看看HTML，CSS和Javascript。 ： - 。）

Answer 1

如果您使用visibility: hidden;，则应使用display: none;代替。

Answer 2

我假设您正在使用可见性：隐藏？正如你所看到的，这将隐藏它，但仍然会占用空间。

但是，使用display：none将隐藏它并将其从页面布局中删除。

Answer 3

#myelement { display:none; }应该已经使用<div id="myelement"></div>

通过CSS完成了

Answer 4

我发现如果我使用visibility: none，那么我将失去嵌入在这些对象中的目标。因此，我设置了font-size: 0pt，这似乎对我有用。

我用它来隐藏ReSTructured文本为内联内部目标输入的默认名称; span.target { font-size: 0pt };

Answer 5

最常见的解决方案是隐藏类型的输入。

<input type="hidden" value="yourvalue" id="yourid" />

不需要造型。

您可以使用类似

的内容设置此输入的值

document.getElementById('yourid').value="The Value Here";

Answer 6

为什么你不能只设置style =“display：none”或style =“visibility：hidden”，然后在你输入缺少的内容后将其设置为可见？

Answer 7

style="visibility:hidden;line-height:0;"

将高度设置为小于行高通常是浪费时间。

Answer 8

要隐藏元素，请使用：

document.getElementById(Id).style.display = "none";

要显示元素，请使用：

document.getElementById(Id).style.display = "inline-block";