HTML默认合并空格，诗歌排版需用 、white-space:pre-wrap或全角空格；推荐white-space:pre-wrap配合全角空格，兼顾兼容性、自动换行与中文排版稳定性。
HTML里空格被合并是默认行为
浏览器渲染时会把连续的多个空格、换行、制表符全部压缩成一个空格，这是 HTML 规范定义的“空白符折叠”规则。所以直接写 或敲四下空格，最终只显示一个空格——诗歌需要的缩进、对齐、字间留白全会丢失。
用 手动替换空格最直接
适用于短诗或固定格式，可控性强，兼容性极好（所有浏览器都支持）：
- 每个
- 比如“ 春风拂面”要保留两个汉字前的两个空格，写成：
春风拂面 - 注意不要混用普通空格和
- 缺点是可读性差、编辑麻烦，长诗维护成本高
white-space: pre 或 pre-wrap 更适合整段诗歌
给容器元素（如 <p> 或 <div>）加 CSS 样式，让浏览器按源码空格和换行原样渲染：
-
white-space: pre：保留空格和换行，但不自动换行（超宽会溢出） -
white-space: pre-wrap：保留空格和换行，且内容过长时自动折行——诗歌排版推荐这个 - 示例：
<p style="white-space: pre-wrap"> 山高 水远</p>，其中中文全角空格或英文空格都有效 - 注意：缩进若用 Tab 键输入，在部分编辑器中可能被转为空格或不可见，建议统一用空格键或全角空格
全角空格（ ）在中文诗里更稳妥
中文排版常用全角空格（Unicode U+3000）替代英文空格，它天然不会被折叠，也不依赖 CSS：
立即学习“前端免费学习笔记（深入）”；
- 输入方式：中文输入法下按空格键（通常默认输出全角空格），或直接粘贴字符
- 在
<pre>外也能用，比如<p> 月落乌啼</p>，只要字体支持就显示正常 - 缺点是语义上不算标准空白符，复制到纯文本环境可能变乱码或丢失，且无法用 CSS 的
text-indent控制首行缩进 - 如果用
white-space: pre-wrap+ 全角空格，兼容性和视觉一致性最佳
真正麻烦的不是怎么加空格，而是混合使用时的隐性冲突：比如在 pre-wrap 容器里又塞了 ，或者用全角空格却忘了字体不支持显示为等宽——这些地方一错，整行对齐就偏了。
