该
visibility属性仅告诉浏览器是否显示元素。它是可见的（
visible-您可以看到）或不可见的（
hidden-您看不到）。
该
display属性告诉浏览器 如何
绘制和显示元素（如果有的话）-是将其显示为
inline元素（即，与文本和其他内联元素一起流动）还是
block-level元素（即，具有height和width属性，你可以设置，它的浮动等），或
inline-block（即它的作用就像一个黑匣子，但奠定了直列代替）和其他一些人（
list-item，
table，
table-row，
table-cell，
flex，等）。
当您将元素设置为，
display: block但 又将 set设置
visibility:hidden为时，浏览器仍将其视为块元素，除非您看不到它。有点像您将一个红色框堆叠在一个看不见的框之上：该红色框看起来像漂浮在空中，而实际上却位于您看不见的物理框之上。
换句话说，这意味着
display不
none存在的元素仍然会影响页面中元素的流动，无论它们是否可见。围绕元素的框的
display:none行为就像该元素从不存在（尽管它仍保留在DOM中）。
