CSS中display:none，visibility:hidden，opacity：0的区别 相同点1、三者都可以隐藏元素不同点占据空间1、display：none，隐藏之后是不占据空间的，而且它和它所有的子元素都会被隐藏。2、visibility：hidden ，隐藏之后是会占据空间。3、opacity：0，则是让元素变透明，也是会占据空间。子元素是否继承1、display：none，不会被继承因为都被隐藏了。2、visibility：hidden ，会被子元素继承，但是可以通过设置visibility：visible来让子元素显示。3、opacity：0，会被子元素继承。事件1、display：none，无法触发事件。2、visibility：hidden ，无法触发事件。3、opacity：0，仍会触发事件。动画1、display：none，不在生效。2、visibility：hidden ，不在生效。3、opacity：0，仍会生效。回流和重绘1、display：none，产生回流和重绘。2、visibility：hidden ，只会引起页面重绘。3、opacity：0，只会引起页面重绘。