引用标签语义错误会导致辅助技术误判和语义丢失；<blockquote>仅用于独立成块引用，<q>仅用于行内短引；cite属性必须为有效URL且不可省略，是机器可读来源的唯一标准。
引用标签写错会直接导致语义丢失，不是样式问题
HTML 的 <blockquote> 和 <q> 不是“换个字体”用的，浏览器和读屏器靠它们识别引述内容。如果只是想缩进或加引号，用 CSS 更合适；硬套引用标签反而让辅助技术误判结构。
常见错误现象：<blockquote> 里塞大段未分段文字、嵌套多个 <p> 却不加 cite 属性、用 <q> 包整段话（它只适合行内短引）。
-
<blockquote>必须用于**独立成块的引用内容**，比如摘录他人整段论述、文章节选 -
<q>只能用于**行内短引用**，例如“这个方案很激进”，且浏览器默认给它加英文引号（中文需 CSS 覆盖） - 带出处时，优先用
cite属性（值为 URL），而不是在标签里手写“——张三《前端杂谈》” - 不要为了视觉效果把
<blockquote>当容器用，它没有 class 或 style 就不该存在
cite 属性不是可有可无的装饰
cite 是 <blockquote> 和 <q> 的唯一标准属性，它的作用不是显示文字，而是提供机器可读的原始来源链接。很多开发者删掉它，改用 <footer> 或 <small> 手动写出处，这会让引用关系断裂。
使用场景：你引用了 MDN 上 Array.prototype.map() 的说明，cite 值就该是 "https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/map"。
立即学习“前端免费学习笔记（深入）”；
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
-
cite值必须是**有效 URL**（可以是相对路径），不能是纯文本或空字符串 - 即使出处是纸质书，也建议用 ISBN 链接（如
https://isbnsearch.org/isbn/97875198XXXXX）而非留空 - 浏览器不会自动显示
cite内容，但爬虫、阅读器、SEO 工具会提取它
嵌套引用容易触发语义混乱
当一段话里既有原作者引述，又有你转述他人观点，嵌套 <blockquote> 或混用 <q> 很快会让结构不可读。HTML 规范没禁止嵌套，但实际中超过一层就难维护。
错误示例：<blockquote cite="a"><blockquote cite="b"><blockquote cite="c">... —— 这不是“强调三层引用”，而是放弃语义控制。
- 单层
<blockquote>+ 行内<q>组合更可控，例如段落中用<q>标出被引的关键词 - 如果真需多级引用，优先拆成多个独立
<blockquote>，用标题或上下文区分层级 - 避免在
<q>里再套<q>，它不支持子引用语义
兼容性不是问题，但 SSR 和静态生成要注意时机
所有现代浏览器对 <blockquote> 和 <q> 渲染一致，问题常出在服务端渲染或静态站点生成阶段：比如框架把 cite 属性序列化成小写 cite（正确），但某些旧版 JSDOM 会忽略它；或者构建工具自动移除“无样式属性”。
性能影响几乎为零，但若你在 getStaticProps 或 generateStaticParams 里动态拼 cite URL，要确认路径没被 base64 编码或双重转义。
- 检查生成的 HTML 源码，确认
cite属性真实存在且值未被截断 - Vite / Next.js 默认保留
cite，但若用了自定义 HTML 压缩插件（如html-minifier-terser），需显式配置ignoreCustomFragments - 不要依赖 JavaScript 动态添加
cite，语义应在初始 HTML 中确立
cite 没填对、嵌套过深、或用错标签类型，语义就已失效。 
