我使用可视性:隐藏来隐藏某些元素，但它们在隐藏时仍然占用页面空间。
我怎么能让它们在视觉上完全消失，就好像它们根本不在DOM中一样(但实际上没有从DOM中删除它们)?
当前回答
由于我一直在解决这个问题并进行研究，所以我想分享一下我的见解。如果您已经进入了这个页面，我假设您正在试图弄清楚为什么您的元素占用了页面上的空间，即使有样式。Display = "none"。
最有可能的是，造成这种情况的原因并不是存在问题的元素;而是它的孩子、父母或兄弟姐妹。打开控制台，转到Elements选项卡。看看里面有什么可能占据空间的线索。也许你正在使用模板引擎，并没有意识到<br>是在动态<div>之外呈现的。或者，您应该瞄准嵌套更多的元素。在进行故障排除时，请尝试按照这些思路进行思考。
其他回答
切换显示不允许平滑的CSS过渡。相反，切换能见度和最大高度。
visibility: hidden;
max-height: 0;
由于我一直在解决这个问题并进行研究，所以我想分享一下我的见解。如果您已经进入了这个页面，我假设您正在试图弄清楚为什么您的元素占用了页面上的空间，即使有样式。Display = "none"。
最有可能的是，造成这种情况的原因并不是存在问题的元素;而是它的孩子、父母或兄弟姐妹。打开控制台，转到Elements选项卡。看看里面有什么可能占据空间的线索。也许你正在使用模板引擎，并没有意识到<br>是在动态<div>之外呈现的。或者，您应该瞄准嵌套更多的元素。在进行故障排除时，请尝试按照这些思路进行思考。
尝试设置display:none为隐藏，设置display:block为显示。
显示:none是解决方案，这是完全隐藏元素与它的空间。
关于显示:无，可见性:隐藏
可见性:隐藏意味着标签不可见，但是在页面上为它分配了空间。
显示:none表示完全隐藏元素的空间。(尽管您仍然可以通过DOM与它交互)
如果显示:无;不管用，你必须加上clear: none;