display:none 和 visibility:hidden的区别

display:none及visibility:hidden 两者均是隐藏元素，但是还是有区别的

区别：

dispaly:none  隐藏元素后，不占据文档流--会产生回流和重绘

visibility:hidden 隐藏元素，但却占据文档流--会重绘

例如：

<p>我是第一行元素</p>
<p style='display:none'>我是第二行元素</p>
<p style='visibility:hidden'>我是第三行元素</p>
<p>我是第四行元素</p>