在页面上隐藏元素的方法有哪些
方法 | 是否占据空间 | 是否响应事件 | 补充说明 |
---|---|---|---|
display: none; |
否 | 否 | 会引起回流和重绘 |
visibility: hidden; |
是 | 否 | - |
opacity: 0; |
是 | 是 | 会引起重绘 |
position: absolute;top: -100px; 将元素移除可见区域 |
是 | - | - |
transform: scale(0); 将元素缩放为 0 尺寸 |
是 | 否 | - |
z-index: -999; 层级调低的同时在同样的位置上用其他元素覆盖 |
是 | 否 | - |
ransform: rotateY(90deg); 或transform: rotateX(90deg); 使元素在 x/y 轴不可见 |
是 | - | - |
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步