如何折叠空div？

Question

我有一个div，我想用于动态内容。当填充div的内容不存在时，我不想看到它。现在，我可以看到一个5px的盒子。即使我删除了填充物，我仍然可以看到大约1px的盒子。如果没有内容，如何删除该框？

#test {
border:1px dashed red;
font-size:16px;
margin:20px 0 0 0;
width:332px;
background-color:#eee;
padding:5px 0 5px 60px;
}

Answer 1

你可以用CSS做：

 div#test:empty {
       display: none;
    }

Answer 2

如果您移除了padding，margin和border（您在问题中未提及），则高度将为0px，您将看不到任何内容浏览器。查看下面的屏幕截图和offsetHeight值。

例如，您可以在#test下创建另一个div，然后为display:none添加#test，您会看到第二个div的位置不会改变。

Answer 3

如果你有兴趣的话，还有一种jquery方式可以做到这一点。 :empty选择器可以隐藏这样的内容：

$('#test:empty').hide();

Answer 4

因为有一个div。你必须使用服务器端编程语言（或者javascript）来完成这项工作。例如：

if(content()) // if there is any content
{
 echo "<div id=\"test\"></div>";
}
else
{
}

Answer 5

使用右上角的搜索框怎么样？

Hide empty div会指出您之前已经回答过的相同问题。