HTML中强制换行必须用<br>标签，因其仅实现视觉换行且无语义；而<p>表示有语义的段落，自带间距。滥用<br>会破坏语义结构、影响SEO和无障碍访问，响应式布局中应优先使用CSS控制换行。
HTML里换行用 <br>，不是空格或回车
html会把连续的空白符（空格、换行、制表符）压缩成一个空格，所以直接敲回车或加多个空格都没用。想强制换行，必须用 <br> 标签——它不产生新段落，只是插入一个换行符。
常见错误现象：
写了一段文字，源码里明明分了行，浏览器里却挤成一坨；或者用 <p> 套每行，结果行间距过大、语义混乱。
-
<br>是自闭合标签，写成<br>或<br/>都可以，但别写<br></br>（无效） - 适合场景：地址、诗、歌词、表单提示文案等需要控制换行位置但不需要段落语义的地方
- 别用它代替 CSS 排版——比如列表项之间、标题和正文之间，该用
<p>、<div>或 margin 就别硬塞<br>
<p> 和 <br> 什么时候该选哪个
核心区别不在“能不能换行”，而在“要不要语义”。<p> 表示一段完整内容，自带上下外边距；<br> 只是视觉断行，无语义。
使用场景举例：
「北京市朝阳区
建国路8号」→ 用 <br> 合理，因为是同一地址的两行物理信息。
「今天天气很好。
我们决定去公园。」→ 这两句是两个独立陈述，该用两个 <p>，而不是 <br>。
- 搜索引擎和读屏软件靠语义理解结构，滥用
<br>会让内容难以被正确解析 - 移动端响应式布局中，
<p>的 margin 可被 CSS 统一调整，而一堆<br>得逐个删改 - 如果某处换行在小屏幕要取消（比如让地址变成一行），用
<span>+ CSS 更可控，<br>则无法用 CSS 隐藏
用 CSS 实现换行的替代方案（更灵活）
当换行逻辑依赖内容长度、容器宽度或设备尺寸时，<br> 就不够用了。这时候得靠 CSS 控制文本流。
立即学习“前端免费学习笔记（深入）”；
常见错误现象：
英文长单词撑破容器、中文标题在窄屏被截断、按钮文字换行错位。
-
white-space: normal（默认）允许正常换行；white-space: nowrap强制不换行；white-space: pre-wrap保留换行符且允许自动折行 -
word-break: break-word或overflow-wrap: break-word可让超长单词/URL 在容器边界处折行 - 对内联元素（如
<span>）设display: block再配width，也能实现可控换行，比塞<br>更干净
容易被忽略的细节：空格、<pre> 和服务器输出
开发中真正导致“换行失效”的，往往不是标签选错，而是前后端协作或模板渲染的问题。
比如后端返回的字符串里带 \n，前端直接插进 HTML 就不会生效；又比如 Markdown 渲染后没转义空格，或 CMS 编辑器自动过滤了 <br>。
-
<pre>会原样保留所有空白和换行，适合代码块、日志，但默认字体等宽、无样式继承，别乱用 - 服务端模板（如 Jinja2、EJS）中，换行可能被模板引擎吃掉，需查文档确认是否开启
keep_trailing_newline类似选项 - Vue/React 中，JSX 里的换行会被编译为字符串空格，想保留需显式写
{'\n'}或用<br>
换行看着简单，但混着语义、渲染、数据流转一起出现时，最容易卡在“明明写了 <br> 却没反应”这种问题上——先看浏览器开发者工具里 HTML 结构是否真存在，再查是不是被 CSS white-space 锁死了。
