<blockquote> 是语义标签而非缩进容器；必须用 <p> 包裹每段，cite 仅接受 URL，人类出处须用 <footer> 写在内部末尾，引号须用伪元素生成。
直接说结论：blockquote 不是“加缩进的容器”，而是语义标签；可访问性出问题，90% 是因为裸文本、缺 、乱用 cite 属性、或把出处塞错位置。
blockquote 里不能直接写文本，必须用
包裹
浏览器能渲染 <blockquote>第一段。第二段。</blockquote>，但屏幕阅读器大概率连读成一句，CSS 无法单独控制第二段的 margin-top，XHTML strict 或部分 CMS 会报“内容模型不匹配”。
正确结构只有一种：<p> 是必需容器，每段自然段必须独立包裹：
<blockquote cite="https://example.com"> <p>这是第一段引用内容。</p> <p>这是第二段，逻辑上独立。</p> </blockquote>
- 若引用中含列表、小标题或
<pre>，可合法嵌套，只要语义合理 - 别用换行符
\n或空格模拟分段——HTML 会合并空白，纯属视觉欺骗 - 多段引用不加
<p>，等于主动放弃段落语义和可访问性控制权
cite 属性只接受 URL，填错就等于没写
cite 是机器可读元数据字段，浏览器不渲染它，也不校验链接是否有效，但它会拒绝非 URL 格式。填 cite="《JavaScript 高级程序设计》" 或 cite="张三"，HTML 验证器直接报错，document.querySelector('blockquote').cite 返回 null。
立即学习“前端免费学习笔记（深入）”；
- ✅ 正确值：
cite="https://zh.wikisource.org/wiki/静夜思"、cite="/poems/jingyesi.html"、cite="#section2" - ❌ 错误值：
cite="《重构》"、cite="Martin Fowler"、cite="post.html"（静态站易 404） - ⚠️ 注意：URL 必须指向真实可访问的原始页面，不是首页，不是 PDF 下载链接，更不能是空字符串
人类可读的出处必须手动加，且只能放 内部末尾
cite 属性本身不可见。想让用户看见“出自哪里”，必须在 <blockquote> 内部末尾手动加结构化 HTML。
-
<footer>是唯一合规、兼容性最好的容器，且必须是<blockquote>的**直接子元素** -
<cite>只用于作品标题、文章名、网站名（如<cite>HTML Standard, W3C</cite>），**不能包人名、出版社或页码** - 作者名、时间、页码等用普通文本写在
<footer>里，例如：<footer>— 李四, 《前端语义手册》, 2025</footer>
错误示例：<cite><blockquote>...</blockquote></cite>；正确组合：<blockquote cite=""><p>...</p><footer>— <cite>《重构》</cite>, Martin Fowler</footer></blockquote>
样式重置别碰 text-indent，引号必须用伪元素生成
浏览器默认给 <blockquote> 加的是左右外边距（Chrome/Firefox 约 40px），text-indent 对它完全无效——它只影响首行首字符，多段引用反而更难读。
- 真正起作用的是
margin-inline-start或padding-left，推整个块，所有子元素统一缩进 - 引号必须用 CSS
::before/::after生成，不能硬编码 HTML 字符，否则无法随lang切换（中文「」 vs 英文 “”） - 避免在
::before里用大图标字体或 SVG，会触发额外重绘，影响性能
真正难的不是怎么写，而是判断“这段话到底算不算引用”——不是所有带破折号或斜体的文字都该塞进 <blockquote>。
