text-indent: 2em 是中文字体首行缩进的可靠起点，但需依字体宽度微调；等宽字体宜用 4ch；flex/grid 中失效时应改用 padding-left 模拟；em 随字号缩放，rem 受根字体影响，ch 最稳但 Safari 不支持。
text-indent: 2em 是起点，不是终点
直接写 text-indent: 2em 能让多数中文字体（微软雅黑、思源黑体、苹方）视觉上接近两字宽，但它不是“绝对精准”的数学公式——不同字体的汉字实际宽度差异明显：等宽字体（如 Fira Code 中文版）一个字占约 2ch，而比例字体里“口”和“龜”的字宽可能差 30%。所以 2em 是可靠起点，但需按字体微调。
- 微软雅黑/思源黑体下，
text-indent: 2em基本可用 - 用等宽中文字体时，优先试
text-indent: 4ch（因一个中文字符 ≈ 2ch） - 若字体偏窄（如某些手写体），可降为
1.8em；偏阔（如汉仪旗黑）可升至2.2em - 避免在同一个
p内混用多套字体大小或font-variant，否则首行缩进会以第一个字符的font-size为基准，后续字号变化不改变缩进量
遇到自定义字体时，必须检查 font-display 和加载时机
Web 字体（如 @font-face 引入的「霞鹜文楷」）加载完成前，浏览器会先用后备字体渲染，此时 text-indent 按后备字体计算；字体加载后重排，缩进可能“跳变”。这不是 bug，是字体回退机制导致的视觉抖动。
- 加
font-display: swap可减少空白期，但不能消除缩进变化 - 更稳的做法：给
@font-face加size-adjust或用ascent-override对齐基线（仅 Chromium 支持），但目前主流方案仍是接受轻微跳变 - 调试时，在开发者工具的 Elements 面板里右键段落 → “Force element state” → 勾选
:loaded，观察字体加载后的 computedtext-indent是否仍为预期值
flex/grid 容器里 text-indent 失效？本质是块格式化上下文被覆盖
当 p 在 display: flex 或 display: grid 的父容器中时，它虽仍是块级元素，但其内部行盒（line box）的生成逻辑受父容器影响，text-indent 可能不触发或表现异常——这不是兼容性问题，而是 CSS 规范定义的行为。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 别强行加
display: block，它解决不了根本问题 - 正确做法：改用
padding-left模拟缩进，但只对这个p单独处理，例如：.article-content p { padding-left: 2em; text-indent: -2em; }（负缩进抵消首字左移，再靠 padding 左推整段） - 注意补
overflow: hidden防止负缩进内容溢出 - 若容器是
grid且列宽固定，还可考虑用grid-template-columns: 2em 1fr+grid-column: 1 / -1把缩进转为布局控制
用户系统字体放大或 zoom 时，em 和 rem 表现完全不同
用户在 macOS 系统设置里开启「更大字体」，或在 Chrome 里按 Ctrl + + 放大页面，em 缩进会随当前元素 font-size 同比放大，而 rem 则取决于根元素是否被 JS 动态修改过。很多夜间模式库会改 html { font-size: 18px }，这时 2rem 就从 32px 变成 36px，缩进突然变宽。
- 纯静态页、无 JS 控制根字体的项目，
2rem和2em效果一致 - 用了动态字体切换（如主题切换器），一律用
2em，避免根字体扰动 - 测试时务必打开系统「辅助功能→显示→更大字体」+ 浏览器 zoom 到 150%，看缩进是否仍维持可读的两字感
-
ch单位在 zoom 下最稳（因基于当前字体的 “0” 字宽），但 Safari 至今不支持text-indent的ch，上线前必须查 caniuse.com/text-indent-ch
复杂点在于：缩进不是独立属性，它和字体加载、布局上下文、用户环境三者实时耦合。你调得再准，换台设备或点一下 zoom，就可能需要重新验证。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
