我使用可视性:隐藏来隐藏某些元素,但它们在隐藏时仍然占用页面空间。

我怎么能让它们在视觉上完全消失,就好像它们根本不在DOM中一样(但实际上没有从DOM中删除它们)?


当前回答

下面是关于展示后放回原处的另一种看法:没有。不要使用display:block/inline等。相反(如果使用javascript)设置css属性显示为“(即空白)

其他回答

Display:none隐藏,设置Display:block显示。

尝试设置display:none为隐藏,设置display:block为显示。

看,与其使用可见性:隐藏;使用display: none;。第一个选项将隐藏,但仍然占用空间,第二个选项将隐藏,但不占用任何空间。

如果所有隐藏元素的其他选项都不适合你,还有另一个选项,我没有看到提到。假设元素没有子元素,它就能工作。

它将隐藏一个元素而不占用空间:

display: contents;

检查浏览器的支持,因为它是一个较新的CSS特性。

$('#abc').css({"display":"none"});

这将隐藏内容,也不会留下空白。