display:none与visibility：hidden

1. display：none：会让元素从渲染树中消失，渲染的时候不占据任何空间；
   visibility：hidden：不会让元素从渲染树中消失，渲染的时候任然占据空间，只是内容不可见。

2. display: none：是非继承属性，子孙节点消失是由于元素从渲染树中消失造成的，通过修改子孙节点的属性无法显示；
   visibility: hidden：是继承属性，子孙节点消失是由于继承了hidden，通过设置visibility：visible，可以让子孙节点显示。

3. 读屏器不会读取display：none的元素内容，而会读取visibility：hidden的元素内容。

4. display：none隐藏产生的reflow和repaint（回流与重绘），而visibility：hidden没有这个影响前端性能的问题。