Answers:
尝试设置display:none为隐藏并设置display:block为显示。
display: block，某些项目必须设为display: inline（例如<span>或<a>或<img>DOM元素）。
hidden用display: none。将类添加到元素中以将其隐藏，将其删除。删除它时，该display属性将还原为默认元素。
使用display:none是一个很好的选择，只是删除了一个元素，但对于屏幕阅读器也将被删除。也有讨论是否会影响SEO。在A List Apart上有一篇关于该主题的简短文章
如果你真的只是想隐藏并不会删除元素，更好地利用：
div {
position: absolute;
left: -999em;
}这样，屏幕阅读器也可以读取它。
此方法的唯一缺点是，此DIV实际上已渲染，并且可能会影响性能，尤其是在手机上。
visibility: hidden;，假设您还有其他绝对元素，则它们不会对空间产生冲突，只是存在冲突z-index。只是为了隐藏我要使用的元素visibility
看，而不是使用visibility: hidden;use display: none;。第一个选项将隐藏但仍会占用空间，第二个选项将隐藏且不占用任何空间。
这个问题的答案是说要使用display：none和display：block，但这对试图使用css过渡来显示和隐藏可见性属性的人没有帮助。
这也使我发疯，因为使用display会杀死任何CSS过渡。
一种解决方案是将其添加到使用可见性的类中：
overflow:hidden这项工作确实取决于布局，但是它应该将空内容保留在其所在的div中。
显示：没有什么是解决方案，那完全用空间隐藏了元素。
display:none和的故事visibility: hiddenvisibility:hidden 表示该标签不可见，但已在页面上为其分配了空间。
display:none表示完全隐藏元素及其空间。（尽管您仍然可以通过DOM与之交互）
display:none隐藏并设置display:block显示。
as though they are not in the DOM at all (but without actually removing them from the DOM)
visibility: hidden仅停止显示内容，但仍使用垂直/水平空间，display：none删除元素的垂直/水平空间。
切换display不允许平滑的CSS过渡。而是同时切换visibility和和max-height。
visibility: hidden;
max-height: 0;transform: translateX(-100%)。我们不想要display: none
这是在展示后将它们放回原处的另一种做法：无。不要使用display：block / inline等。而是（如果使用javascript）将CSS属性显示设置为”（即空白）
据我所知，有四种可能
<button style="display:none;"></button>#buttonId{ display:none; }$('#buttonId').prop('display':'none');和 $("#buttonId").css('opacity', 0);
offsetTop，并将其display:none设置offsetTop为0。我的解决方案是使用，visibility: hidden然后将width和height设置为0。一旦需要使该元素再次可见，便使用删除了这三个属性Javascript。有点棘手的解决方案，但是它几乎可以在所有用例中很好地工作。