流式缩放必须用 rem + 无单位 line-height 组合：根元素控制 font-size，行高用纯数字乘数自动适配；禁用 zoom 和 transform: scale()，避免破坏可访问性、打印及交互；所有间距也需统一用相对单位。
文字流式缩放不是靠“让字体跟着屏幕变大变小”这种模糊感觉，而是必须确保 font-size 和 line-height 同步、按比例、可继承地响应变化——否则小屏字挤成一团，大屏行距松垮断裂，用户一缩放页面就乱套。
用 rem + 无单位 line-height 是唯一可靠组合
根元素 html 控制基准，所有字号用 rem，行高必须写成纯数字（如 1.6），不能带 px 或 em。浏览器会为每个元素用它自己的 font-size × 这个乘数算出行高，父子嵌套时自动适配，不会卡死。
-
html { font-size: 16px; }是安全起点；若需支持系统字体放大，改用font-size: 100%; -
body { font-size: 1rem; line-height: 1.6; }—— 此时实际行高 =16px × 1.6 = 25.6px -
h1 { font-size: 2rem; }→ 行高自动变成32px × 1.6 = 51.2px，不用重复写line-height - 一旦用
line-height: 24px，子元素继承后还是24px，和它自己的字号完全脱钩
动态调字号必须改 document.documentElement.style.fontSize
按钮点击放大文字，别去改某个 div 或 body 的 font-size，那样只影响局部，且 rem 基准没变，其他地方照样不动。真正生效的是改根元素。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 正确：
document.documentElement.style.fontSize = '18px'; - 错误：
document.body.style.fontSize = '18px';（rem仍按16px算） - 记得加范围限制：最小不小于
12px（防不可读），最大不超过24px（防撑破布局） - 用
localStorage存上次值，刷新页面后恢复，别让用户每次重点
千万别用 zoom 或 transform: scale() 搞文字缩放
这两个看似一行 CSS 就搞定，但代价是放弃语义、可访问性和打印支持——它们只是把渲染结果“画小了”或“画大了”，DOM 尺寸、事件热区、滚动高度、屏幕阅读器感知全都不同步。
立即学习“前端免费学习笔记（深入）”；
-
zoom：Firefox 完全不认，Chrome/Edge 已标记为弃用，且不触发重排，getBoundingClientRect()返回原始尺寸 -
transform: scale(1.2)：文字变大，但按钮宽度、行高、内边距、焦点框位置全没变，键盘导航和语音朗读会跳空 - 打印时，
transform默认被忽略，用户拿到的 PDF 还是原始字号 - 更隐蔽的问题：iOS Safari 在某些 zoom 场景下会禁用双击放大，破坏基础交互
最易被忽略的一点：改完 font-size 后，所有依赖 em 或 rem 的间距（margin、padding、border-radius）都会跟着变——如果你混用了 px 边距或固定高度的容器，视觉节奏立刻崩掉。整套流式缩放要生效，必须从根字号开始，一路用相对单位到底。
