是唯一直接在文本流中插入单次强制换行的HTML元素，仅适用于同一语义单元内手动控制换行，如地址、诗歌、表单提示；必须写成自闭合形式，不可包裹内容或滥用为分段。


是唯一能直接在文本流中插入单次强制换行的 HTML 元素，它不产生新段落、不带间距、不改变语义，只做视觉断点。

什么时候必须用
？

仅当你要在**同一语义单元内**（比如一个

里）手动控制换行位置时才适用：

• 地址信息：如“北京市朝阳区XX路1号
邮编：100020”
• 诗歌或歌词：每行有固定格式，不能拆成多个

• 表单内提示文案：如“密码需包含大小写字母和数字
至少8位”
• 避免把语义结构搞乱——别用
替代
  或
  来分隔段落

  
的写法和常见错误

  HTML5 中必须写成自闭合形式
，不是
，也不是
（虽然部分浏览器兼容，但不符合规范）：

  • ✅ 正确：

    第一行
    第二行

    

    HTML Text Extract

    从HTML页面（URL、文件或标准输入）中提取主体内容文本，去除导航、页脚、广告和模板文本。可直接传递给readability_check或其他文本工具。

    下载
  • ❌ 错误：
（
没有闭合标签）
  • ❌ 错误：
内容（
是空元素，不能包裹内容）
  • ⚠️ 注意：连续多个
会产生多余空行，视觉上等价于多个换行符，但语义上仍是无意义堆叠

  为什么有时
看起来没生效？

  最常见原因是父容器设置了 white-space: nowrap 或 display: inline-block 且宽度足够容纳全部内容：

  • 
在 white-space: nowrap 下仍会生效，但若整行没溢出，换行效果可能被忽略（实际已换，只是没视觉位移）
  • 如果父元素是 display: flex 且未设 flex-direction: column，
不起作用——Flex 容器内换行由布局决定，不是文本流
  • 某些 CSS 重置库（如 normalize.css）可能对
的 margin/padding 做了干预，但标准行为本就不带边距

  替代方案比
更合适的情况

  多数时候，你应该优先考虑语义或 CSS 方案，而不是硬塞
：

  • 想分段？用
    —— 它自带语义、可访问性、默认上下边距
  • 想保留源码换行？用 white-space: pre-line 配合真实换行符（\n），不用写一堆

  • 想让长单词/URL 折行？加 overflow-wrap: break-word，不是靠
手动切
  • 动态内容（如后端吐出带 \n 的字符串）？别用 JS 拆字符串插
，改用 white-space: pre-line + innerHTML

  真正需要
的地方其实不多；一旦开始批量用它来“排版”，说明 HTML 结构或 CSS 控制已经失控了。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！