text-align: justify 对 p 标签无效是因为需同时满足三条件：p 为块级元素、容器有明确宽度、文本足够长能自然折行；中文需加 text-justify: inter-character 和 lang="zh" 才生效。
text-align: justify 为什么对 p 标签没反应
不是写错了，是它根本没触发条件。浏览器只在“能换行的多行文本”上拉伸间距，text-align: justify 对单行无效——哪怕你写了 <p style="text-align: justify">你好</p>，也看不出变化。
真正起效必须同时满足三点：<p></p> 是块级元素（默认满足）、容器有明确宽度（比如设了 width 或父容器是定宽 flex 项）、文本足够长能自然折行。缺一不可。
- 没设
width或max-width？“两端”无从定义，justify 直接退化为 left - 段落只有两三个字或一行？浏览器连断点都找不到，不拉伸
- 用
display: inline-block包裹了<p></p>？它变内联了，justify 失效
中文段落加 justify 几乎没效果，怎么办
这不是 bug，是浏览器按 Unicode 规范行事：Chrome/Edge 默认只在空格、连字符等「单词分隔符」处插入可伸缩间隙，而汉字之间没有天然断点，所以整段看起来和 left 一样。
要让中文真正撑开，得加 text-justify: inter-character，但它有硬性前提：
立即学习“前端免费学习笔记（深入）”；
把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。
- 必须配合
text-align: justify使用，单独写text-justify不生效 - 最好在
<p></p>或最近的父容器上加上lang="zh"，否则 Safari 可能静默忽略 - Chrome 120+ / Edge 120+ / Firefox 110+ / Safari 17.4+ 支持；旧版 Safari 和部分安卓 WebView 完全不识别
稳妥写法：<p lang="zh" style="text-align: justify; text-justify: inter-character;">这是一段中文段落</p>
最后一行总是左对齐，怎么让它也撑满
text-align-last: justify 是唯一标准解，但它只影响最后一行（或单行文本），且行为很挑场景：
- 必须搭配明确宽度（如
width: 300px）才稳定生效，否则无“两端”可对 - iOS Safari 14.5+ 才支持，Android WebView 支持度参差不齐
- 如果末行只剩一两个字，强行拉伸会显得稀疏难看，不如接受默认左对齐
- 别用它去“修复”短段落——四行以内、总字数少于 30 的段落，效果往往适得其反
替代思路：在合适位置插入 <wbr></wbr> 控制断行点，或用 word-break: keep-all 防止中英文混排时英文被意外截断。
中英文混排时两端对齐容易踩的坑
英文部分会正常拉伸，中文部分挤成一团，结果是“半边松、半边紧”。关键问题出在断行逻辑和字体渲染上：
- 某些 Web 字体（尤其等宽字体）会直接忽略
text-align: justify声明 - 没加
word-break: keep-all？英文单词可能被强行拆开，破坏语义 - 用了
letter-spacing？它会和 justify 的自动间隙叠加，导致字距失控 - 设置了
line-height过小？行高不足时，justify 拉伸可能引发文字重叠
推荐组合：text-align: justify; text-justify: inter-character; word-break: keep-all;，再加 lang="zh" 显式声明语言。
