<blockquote>用于标记独立成段的引用文本，非视觉缩进工具；<q>用于行内短引用；二者须配cite属性（填URL）和<footer>（放作者、出处等），引号嵌套超两层应改用CSS控制。
HTML 的 <blockquote> 和 <q> 不是换行或缩进工具，它们的语义和浏览器默认样式常被误用——真要控制外观，得靠 CSS；真要表达引用关系，得配 cite 属性或 <footer>。
什么时候该用 <blockquote> 而不是 <div>？
当你明确在标记「一段从别处摘录的、独立成段的文本」时才用 <blockquote>。它不是为了视觉缩进，而是告诉屏幕阅读器“这是引用”，也影响搜索引擎对内容结构的理解。
- 适用场景：
<blockquote>适合整段摘录（比如论文引文、他人长篇发言）；<q>适合行内短引用（比如对话中的一句话） - 常见错误：只因为“看起来缩进了”就套
<blockquote>，结果语义错乱，无障碍支持变差 - 注意：
<blockquote>会触发浏览器默认上下外边距，但这个样式不可靠——不要依赖它做布局，要用 CSS 显式控制margin或padding
cite 属性到底写什么？
cite 是 <blockquote> 和 <q> 的标准属性，但它**不显示在页面上**，也不该填作者名或书名，而应填「原始出处的 URL」。
- 正确写法：
<blockquote cite="https://example.com/article/123">…</blockquote> - 错误写法：
cite="《重构》"或cite="Martin Fowler"—— 这些信息应放在<footer>或普通文本里 - 兼容性提醒：几乎所有现代浏览器都忽略
cite的视觉呈现，仅部分辅助技术可能读出该 URL；别指望它自动变成链接或脚注
怎么让引用带来源信息又保持语义正确？
HTML5 明确推荐用 <footer>（作为 <blockquote> 的子元素）来放作者、出处、时间等元信息，而不是塞在段落末尾加括号。
立即学习“前端免费学习笔记（深入）”；
- 结构示例：
<blockquote> <p>过早优化是万恶之源。</p> <footer>— Donald Knuth, <cite>Computer Programming as an Art</cite>, 1974</footer> </blockquote>
-
<cite>只用于作品标题（书名、文章名、电影名），不是人名；人名前不加<cite> - 如果来源是网页，
<footer>里可以加<a href="...">，但别把整个<footer>包进链接——语义会混乱
为什么 <q> 嵌套后引号会错乱？
<q> 的引号由浏览器根据语言（lang 属性）和嵌套层级自动添加，但多数浏览器只支持两级：外层双引号、内层单引号。再深就不管了。
- 现象：
<q>他说<q>其实<q>我不同意</q></q></q>在 Chrome 里第三层没引号，还可能漏闭合 - 原因：CSS 的
quotes属性默认只定义两层，且各浏览器实现不一致 - 建议：三层及以上引用，放弃
<q>，改用<span>+ 手动加 Unicode 引号（如“、‘）或 CSS 伪元素控制，更可控
引号自动渲染、cite 属性不可见、<footer> 的位置约束——这些都不是 bug，是 HTML 语义模型的设计选择。想“看起来对”，得先接受它不负责“看起来”，只负责“是什么”。
