display: none 和 opacity: 0 有什么区别？
考察说明
考察 CSS 隐藏元素的机制差异及其对布局、交互和性能的影响
回答思路
- 说明 display: none 会从文档流中移除元素，不占据空间，且不可交互
- 说明 opacity: 0 仍占据空间，元素可见性为透明但可交互，且仍触发事件
- 提到 opacity: 0 会创建层叠上下文，可能影响合成层；display: none 则会触发重排与重绘
- 能结合实际场景说明适用性，如动画过渡用 opacity，彻底移除用 display
本题已收录答题指导
本题附完整参考答案与评分标准
登录后可查看结构化答题指导；也可以直接开一场模拟面试，AI 面试官用本题实时追问并给出评分。