zoom:1 本身不清除浮动，仅激活ie6/7的haslayout使父容器能感知浮动高度；真正闭合需配合::after伪元素或bfc机制。
zoom:1 本身不清除浮动，它只是让 IE6/7 的父容器获得 hasLayout 能力，从而“能感知”浮动子元素的高度；真正起闭合作用的，还得靠 ::after 伪元素或 BFC 触发机制。
为什么只加 zoom:1 父容器高度还是塌陷？
因为 zoom:1 只是告诉 IE6/7：“这个盒子自己管自己”，但它没声明“我要包裹浮动内容”。hasLayout 激活后，父容器才具备了计算内部浮动子元素高度的资格，但不等于自动执行该计算——必须配合显式清除逻辑（如 clear:both）或 BFC 边界（如 overflow:hidden）才能完成闭合。
常见错误现象：
- 只写
.wrap { zoom: 1; }，子元素仍浮动溢出、父容器高度为 0 - 把
zoom:1加在浮动子元素上（如.item { float: left; zoom: 1; }），对父容器塌陷毫无帮助
*zoom:1 的写法和兼容性细节
*zoom:1 是专为 IE6/7 设计的 hack 写法，星号（*）前缀仅被这两个版本识别，现代浏览器直接忽略，安全无副作用。
使用场景与要点：
- 必须加在**浮动子元素的直接父容器**上，不是祖父级，也不是子元素自身
- 不能单独存在，需搭配标准清除方案，例如：
.wrap::after { content: ""; display: block; clear: both; } - IE6 不支持
::after，所以伪元素方案在 IE6 下完全失效，此时*zoom:1是唯一能补救 hasLayout 的手段（但依然要配display: inline-block或height: 1%等触发条件，否则部分 IE6 渲染仍异常） - 避免用
height: 1%替代zoom:1：某些字体设置下 IE6 会将其解析为 0，hasLayout 未真正触发
实际推荐的 IE6–IE7 闭合浮动组合写法
这是经过验证、兼顾语义与兼容性的最小可行方案：
.clearfix {
*zoom: 1;
}
.clearfix::before,
.clearfix::after {
content: "";
display: table;
}
.clearfix::after {
clear: both;
}
说明：
-
*zoom: 1确保 IE6/7 父容器 hasLayout = true -
display: table在 IE6/7 中比block更可靠地触发 BFC，且不会引发 margin 折叠问题 -
::before用于修复顶部外边距合并（top margin collapse），非必需但更健壮 - 现代浏览器走标准伪元素路径，IE6/7 依赖
*zoom:1+display: table的双重保障
现在还值得为 zoom:1 花时间吗？
除非你明确接到需求：支持 IE6 或 IE7（2026 年几乎不存在）。所有主流项目早已放弃这些版本，zoom:1 在当前 CSS 工程中属于历史遗迹。如果你在维护遗留系统，重点不是“怎么写 zoom:1”，而是确认是否真有用户还在用 IE7 访问——很多所谓“兼容要求”其实只是文档没更新。
最容易被忽略的一点：即使加了 *zoom:1，如果父容器本身 display 是 inline 或 table-cell，hasLayout 仍可能不生效；必须确保父容器是常规块级上下文（如 div 默认的 display: block）。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
