display:none和visibility:hidden的区别
1.空间占据
2.回流和渲染
3.株连性
一、空间占据
display:none 隐藏后的元素不占据任何空间，而 visibility:hidden 隐藏的元素空间依旧存在。
二、回流和渲染
display:none 隐藏产生回流和重绘（reflow 和 repaint），而 visibility:hidden 只产生重绘。
三、株连性
display:none 就是“株连性”明显的声明：一旦父节点元素应用了 display:none，父节点及其子孙节点元素全部不可见，而且无论其子孙元素如何不屈地挣扎都无济于事。
四、隐藏失效
若子孙元素应用了 visibility:visible，则这个子孙元素不但不会隐藏，而且会显现出来。
也就是说子元素使用了visibility:visible，父元素的visibility:hidden将会不起作用