text-align: justify 对纯中文无效是因浏览器默认只在单词分隔符处拉伸，需配合 text-justify: inter-character 和 lang="zh" 才能实现字级两端对齐。
text-align: justify 对中文没反应？不是写错了，是浏览器默认不处理字间距
纯中文段落加 text-align: justify 看不出变化，这不是 CSS 写错，而是浏览器按 Unicode 规则只在单词分隔符（如空格、连字符）处插入拉伸间隙，而汉字之间没有天然断点。结果就是整段文字像 text-align: left 一样左贴边，最后一行更是裸露左对齐。
必须同时满足三个条件才可能触发基础 justify 行为：width 或 max-width 明确设值；<p></p> 是块级且内容足够长、能自然换行；英文部分会拉伸，但中文部分仍挤成一团。
常见错误现象包括：<p style="text-align: justify;">你好</p> 没效果（单行不生效）；容器没设宽导致“两端”无参照；lang="zh" 漏写或写在错误层级（比如只写在 <p></p> 上，而父级没声明）。
立即学习“前端免费学习笔记（深入）”；
现代浏览器实现中文字级两端对齐的最小可行写法
Chrome 120+、Edge 120+、Firefox 110+、Safari 17.4+ 支持 text-justify: inter-character，它强制在每个字符间插入可伸缩空白，是目前最干净的解法——但必须和 text-align: justify 同时声明，且依赖 lang="zh"。
正确写法示例：
<p lang="zh" style="text-align: justify; text-justify: inter-character;">这是一段用于演示两端对齐的中文段落。它需要足够长度才能体现效果。</p>
关键点：
-
lang="zh"必须设在<html>标签上，或最近的块级父容器（如<div>、<section>），否则 Safari 可能静默失效 - 单元格内使用时，
lang="zh"要设在<td>或其直接父容器上，不能只靠<table> - 容器必须有明确宽度（
width、min-width或由 flex/grid 限定），否则 justify 无基准 - 内容至少能换出 3 行以上，否则末行仍可能左对齐
最后一行也要撑满？用 text-align-last: justify 就够了
text-align: justify 默认不对最后一行拉伸，这是 CSS 规范行为。想让它也两端对齐，最直接的办法是加 text-align-last: justify。
这个属性在 Chrome/Edge/Firefox 全面支持，Safari 16.4+ 开始支持，且不依赖 lang 或 text-justify。
注意：
- 别对短段落滥用——如果整段就两行，第二行只剩“张三”，强行拉伸反而难看
- 它只影响最后一行，对单行文本无效（此时等价于
text-align: justify） - 配合
text-justify: inter-character使用时，优先级更高，末行也会按字间距均匀分配
旧环境兼容方案：慎用 letter-spacing，别碰 word-break
目标环境含 iOS Safari 16– 或旧版 Edge 时，text-justify: inter-character 会被静默忽略，回退到左对齐。这时可用降级策略：
用 letter-spacing 模拟撑满感，但值必须克制：0.03em～0.06em 是安全区间；超过 0.08em 会导致标点后出现明显空隙（如「。」后面多一格）。
绝对避免 word-break: break-all——它会割裂词语（如把“中华人民共和国”拆成“中华/人民/共/和/国”），破坏语义。若需防溢出，优先用 word-break: keep-all。
表格单元格里尤其容易踩坑：text-align 不继承自 <table>，必须显式写在 <td> 上；且 lang="zh" 和宽度声明缺一不可。
真正麻烦的不是怎么写，而是怎么判断要不要写——多数场景下，一段文字是否值得两端对齐，取决于它是否出现在正式排版区域（如新闻正文、法律条款），而非导航栏或按钮文案。后者用 text-align: center 或 justify-content: space-between 更合适。
