面试题：说说display：none和visibility:hidden区别；visibility:hidden和opacity:0的区别

display：none和visibility:hidden区别

如果一个属性设置display:none那他在页面上显示的空间也会没有，他会直接操作DOM，所用的成本比较大
如果一个属性设置display:visibility他在页面上的空间不会消失，不会操作dom，可以理解为，让这个东西隐身，但是这个东西还是存在的，如果要隐藏的时一个定时器，那么这个定时器还会进行工作，而且如果父元素设置visibility那么他的子元素也会继承这个属性，但是如果重新给子元素设置visibility: visible,则子元素又会显示出来。

visibility:hidden和opacity:0的区别

1.设置这两个css样式的父代子代都会被继承，但是如果子代或者这个元素设置了时间比如点击事件 对于display：visibility就会无效，对于opacity:0有效
2.设置transition过度效果时对于visibility:hidden无效而对于opacity:0有效