text-align: justify 对 p 标签无效是因为需同时满足三条件：p 为块级元素、容器有明确宽度、文本足够长能自然折行；中文需加 text-justify: inter-character 和 lang="zh" 才生效。
text-align: justify 为什么对 p 标签没反应
不是写错了，是它根本没触发条件。浏览器只在“能换行的多行文本”上拉伸间距， 你好text-align: justify 对单行无效——哪怕你写了
真正起效必须同时满足三点：
是块级元素（默认满足）、容器有明确宽度（比如设了
width 或父容器是定宽 flex 项）、文本足够长能自然折行。缺一不可。
- 没设
width或max-width？“两端”无从定义，justify 直接退化为 left - 段落只有两三个字或一行？浏览器连断点都找不到，不拉伸
- 用
display: inline-block包裹了？它变内联了，justify 失效
中文段落加 justify 几乎没效果，怎么办
这不是 bug，是浏览器按 Unicode 规范行事：Chrome/Edge 默认只在空格、连字符等「单词分隔符」处插入可伸缩间隙，而汉字之间没有天然断点，所以整段看起来和 left 一样。
要让中文真正撑开，得加 text-justify: inter-character，但它有硬性前提：
- 必须配合
text-align: justify使用，单独写text-justify不生效 - 最好在
或最近的父容器上加上lang="zh"，否则 Safari 可能静默忽略 - Chrome 120+ / Edge 120+ / Firefox 110+ / Safari 17.4+ 支持；旧版 Safari 和部分安卓 WebView 完全不识别
稳妥写法： 这是一段中文段落
最后一行总是左对齐，怎么让它也撑满
text-align-last: justify 是唯一标准解，但它只影响最后一行（或单行文本），且行为很挑场景：
- 必须搭配明确宽度（如
width: 300px）才稳定生效，否则无“两端”可对 - iOS Safari 14.5+ 才支持，Android WebView 支持度参差不齐
- 如果末行只剩一两个字，强行拉伸会显得稀疏难看，不如接受默认左对齐
- 别用它去“修复”短段落——四行以内、总字数少于 30 的段落，效果往往适得其反
替代思路：在合适位置插入 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" 显式声明语言。
实际效果高度依赖浏览器版本和内容长度，别指望一套 CSS 在所有设备上表现一致。最稳的底线是：先确保容器有宽、文本够长、语言属性到位，再谈 justify —— 否则只是在调试幻觉。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
