caption用于表格标题，figcaption用于图片说明；二者均不自动换行，需用white-space: pre-line等CSS控制；视频字幕应使用track+WebVTT，不可用HTML样式干预。
HTML里没有叫“字幕标签”的标准元素——你可能指的是 <caption></caption>（表格标题）、<figcaption></figcaption>（图片/媒体说明）或富文本中用户输入的字幕类文本（如视频字幕、弹幕、歌词）。它们换行逻辑完全不同，不能一概而论。
caption 和 figcaption 换行靠 CSS white-space
这两个是语义化容器，本身不控制换行。浏览器默认按 white-space: normal 渲染：合并空格、自动折行。若原始内容含 \n（比如后端返回的多行字幕字符串），它会被当成空格忽略。
- 想保留换行符？加
white-space: pre-line：换行生效，多余空格合并，适合地址式字幕（如“主讲人：李四\n时间：2026-10”） - 想保留所有空格+缩进（如 ASCII 字幕艺术）？用
white-space: pre，但注意长行会横向溢出 - 避免用
white-space: pre-wrap在小宽度容器里——它保留空格又允许断行，容易把“一个词中间”劈开 -
<caption></caption>默认居中且加粗，别只改换行忘了重置text-align或font-weight
动态字幕（如 video + track）不走 HTML 换行逻辑
真正在视频上显示的字幕，来自 <track></track> 标签引用的 WebVTT 文件。它的换行由 VTT 语法决定：<br> 标签有效，\n 也有效，但必须写在 <vtt></vtt> 内容体里，不是 HTML 层面加样式能干预的。
Convert Markdown To HTML And PDF - Markdown和HTML、PDF互转
下载
实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。
- WebVTT 中换行写成
第一行<br>第二行或直接回车（需确保文件编码为 UTF-8 且无 BOM） - 不要试图用 JS 把 VTT 字符串塞进
<div> 再加 <code>white-space——这绕过了原生字幕渲染，丢失同步、定位、字体抗锯齿等能力 - 若需自定义样式（如阴影、背景），应通过
::cue伪元素，例如：::cue { white-space: pre-line; } - 绝对不要用
.innerHTML = text.replace(/\n/g, '<br>')—— 若text含<script></script>，就执行了 - 安全做法：先用
textContent插入纯文本，再用 CSS 控制换行：white-space: pre-line；或手动创建<br>节点（需 DOMParser 或 createElement） - 如果必须支持简单 HTML（如
<b></b>），用 DOMPurify 过滤后再replace(/\n/g, '<br>') - 移动端要注意：iOS Safari 对
pre-line的断行位置偶尔偏移，可加word-break: break-word补充兜底
用户提交的字幕文本（如评论区歌词）要防 XSS 并转义换行
这类文本通常来自表单或 API，含原始 \n，直接 innerHTML 渲染会丢失换行，且有安全风险。
立即学习“前端免费学习笔记（深入）”；
最易被忽略的一点：换行是否影响可访问性。屏幕阅读器对 pre-line 容器读作连续语句，而 <caption></caption> 本身已带语义角色 role="caption"，无需额外 aria-label；但手动生成的字幕 <div class="subtitle"> 必须加 <code>role="region" aria-live="polite" 才能被正确播报。
