能，但前提是父元素没被其他display值覆盖；它通过显式创建bfc让父容器重新计算浮动子元素高度，不裁剪、不插入伪元素，但会禁用外边距合并并强制块级化。
display: flow-root 能直接解决高度塌陷吗
能，但前提是父元素没被其他 display 值覆盖。它通过显式创建 BFC，让父容器重新“看见”浮动子元素的真实高度，从而撑开自身——不是靠隐藏溢出、不是靠插入伪元素，就是单纯让盒模型按浮动内容重新计算边界。
哪些 display 值会覆盖 flow-root
浏览器只认最后一个有效的 display 声明，以下值与 flow-root 互斥，写了也无效：
-
display: flex或display: grid（常见于现代布局，此时浮动子元素本身已失效） -
display: inline-block、display: table-cell、display: none - 任何带前缀的旧写法（如
-webkit-box）
检查时直接看 computed style 中的 display 值，不是看你写了什么，而是浏览器最终用了什么。
使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件
下载
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
flow-root 会悄悄改掉什么
它不声不响地重置了两件事，容易引发意料外的样式偏移：
-
margin-collapse被禁用：父容器和第一个/最后一个子元素之间的外边距不再合并 - 如果父元素原本是
inline级（比如span），设flow-root会强制变成块级，导致换行 - 和
contain: layout或contain: paint同时使用时，BFC 行为可能被抑制，高度仍塌陷
IE11 兼容或降级怎么写才靠谱
不能只靠 @supports 包一层就完事，得验证 fallback 是否真生效：
- 明确写出降级规则，例如：
.container { display: flow-root; }@supports not (display: flow-root) { .container { overflow: hidden; } } - 避免在同一个选择器里混写多个
display值（如display: flow-root, block），语法错误 - 旧项目若依赖 JS 读取
offsetHeight，换用flow-root后需同步检查数值是否突变
真正麻烦的从来不是加一行 CSS，而是它改变了盒模型行为却不报错——你得盯着渲染结果，而不是只看控制台有没有红字。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
