blockquote必须带cite属性和footer：cite填合法url供机器识别，footer用自然语言注明作者、书名、年份等可见出处；行内短引用用q标签；格式敏感内容需嵌套pre+code。
blockquote 必须带出处，不能只加缩进
很多人用 blockquote 是为了视觉上“看起来像引用”，结果只写 <blockquote>文字</blockquote>，没加 cite 属性或 footer。这违反语义规范：浏览器和读屏器不认它为真实引用，SEO 也不识别来源，还可能被 Lighthouse 标为可访问性问题。
正确做法是明确标注可溯源的出处：
-
cite属性必须填合法 URL（如https://example.com/post/123），不能是空字符串、相对路径或中文描述 -
footer放可见署名，比如作者、书名、年份，里面可用cite标签包裹作品名 - 多个段落直接用
<p></p>套在blockquote里，别用<br>或空行模拟
短引用用 q，别拿 blockquote 充数
行内一句话引用，比如“这个方案‘简单但有效’”，该用 q 标签：<q>简单但有效</q>。浏览器会自动加双引号（支持 CSS 控制引号样式），且语义清晰。
误用 blockquote 的典型场景：
- 把一句对话或格言单独包成
blockquote—— 它不是“加引号的容器” - 在列表项或段落中嵌套
blockquote只为缩进——该用 CSS 的margin-left或padding - 复制整篇公众号文章后全塞进一个
blockquote—— 缺失出处、无cite、无footer，纯属语义污染
长引用含代码或诗歌，得换 pre + code
blockquote 默认合并空白符，所以原文里的缩进、对齐、多空格都会失效。遇到诗歌、终端输出、JSON 片段这类依赖格式的内容，不能硬塞进普通 p 里。
正确组合是：
- 外层仍用
blockquote表明这是引用 - 内部用
pre保留原始换行与空格 - 再嵌
code表明这是计算机内容（可选，但推荐） - 加上
class控制字体（如font-family: monospace）
示例：
<blockquote cite="https://tools.ietf.org/html/rfc7231"> <pre class="brush:php;toolbar:false;"><code>GET /index.html HTTP/1.1 Host: example.com</code>
cite 属性不可见，footer 才是用户看到的署名
cite 属性只供机器读取（爬虫、辅助技术），不会渲染成页面上的文字。如果你只写了 <blockquote cite="https://a.com">…</blockquote>，用户根本看不到出处是谁、哪本书、哪年写的。
必须配 footer，而且要写人话：
- ✅
<footer>— 李四，《前端性能优化》，2025 年第 2 版，p.47</footer> - ❌
<footer><cite>https://a.com</cite></footer>（URL 不该当署名展示） - ❌
<cite><blockquote>…</blockquote></cite>（cite标签不能包blockquote）
最易忽略的一点：同一引用中 cite 和 footer 不冲突，反而应该共存——一个给机器，一个给人。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
