Opacity: 0、Visibility: hidden、Display: none

178 阅读1分钟

区别

注:Opacity: 0(以下简称opacity)、Visibility: hidden(以下简称visibility)、Display: none(以下简称display)

1. display隐藏后不会占据空间,但仍会渲染, visibility和opacity都会占据空间

2. visibility在父级元素隐藏之后,子元素可以通过设置visibility:visible来取消隐藏,opacity和display不可以

3. display和visibility改变属性的时候会引起重绘, opacity则不会