display:none与visibility:hidden的区

1.display:none的元素不占据任何空间，visibility:hidden的元素空间保留；

2.display:none会影响css3的transition过渡效果，visiblity:hidden不会

3.display:none隐藏产生重绘（repaint）和回流（relfow），visiblity:hidden只会出发重绘；

4.株连性：display:none的节点和子孙节点元素全都不可见，visibility:hidden的节点子孙节点元素可以设置visiblity:visible显示。visibility:hidden属性值具有继承性，所以子孙元素默认继承了hidden而隐藏，但是当子孙元素重置为visibility:visible就不会被隐藏。