CSS规则visibility:hidden和display:none都会导致元素不可见。这些是同义词吗?
当前回答
可见性:隐藏保留空间;显示:没有没有。
其他回答
它们不是同义词——display:没有一个会从页面流中移除元素，页面的其余部分就像它不存在一样。
可见性:hidden在视图中隐藏元素，但不隐藏页面流，在页面上为其留下空间。
当涉及到子节点时，有很大的不同。例如:如果你有一个父div和一个嵌套的子div。所以如果你这样写:
<div id="parent" style="display:none;">
<div id="child" style="display:block;"></div>
</div>
在这种情况下，没有divs是可见的。但如果你这样写:
<div id="parent" style="visibility:hidden;">
<div id="child" style="visibility:visible;"></div>
</div>
然后子div将可见，而父div将不显示。
另一个区别是可见性:hidden在非常非常老的浏览器中有效，而display:none则不行:
https://www.w3schools.com/cssref/pr_class_visibility.asp
https://www.w3schools.com/cssref/pr_class_display.asp
Display: none将元素从页面中完全移除，并且构建页面时就好像该元素根本不存在一样。
可见性:隐藏保留文档流中的空间，即使您再也看不到它。
这取决于你在做什么，可能有也可能没有很大的区别。
display: none;
它将不会出现在页面上，也不会占用任何空间。
visibility: hidden;
它隐藏了一个元素，但它仍然会占用与之前相同的空间。元素将被隐藏，但仍然会影响布局。
可见性:隐藏保留空间，而显示:无不保留空间。
无示例:https://www.w3schools.com/css/tryit.asp?filename=trycss_display_none
示例:https://www.w3schools.com/cssref/tryit.asp?filename=trycss_visibility
