元素隐藏
在 CSS 中,有多种方法可以隐藏元素
div {
display: none
}
- 不占空间,不能点击,触发回流
div {
visibility: hidden
}
- 占据空间,不能点击,触发重绘
div {
opacity: 0
}
- 占据空间,能点击,触发重绘
- 如果 animation 修改 opacity 只触发 GPU 加速,不触发重绘
div {
filter: opacity(0%)
}
- 相比于 opacity,会触发 GPU 加速,可能导致性能下降,同时在一些较老的浏览器中可能不受支持