blockquote 的 cite 属性仅作元数据存储绝对 URL，不渲染显示；正确用法是只填可访问的绝对 URL，且需配合 <footer><cite> 手动展示出处，并用 提供可点击链接。
blockquote 的 cite 属性只存 URL，不显示任何文字
写了 cite 属性却看不到“作者”“书名”或“来源链接”，不是你代码错了，而是它本来就不渲染。浏览器完全忽略该属性的视觉输出，cite 值只作为元数据存在 DOM 中，供爬虫、SEO 工具或部分屏幕阅读器读取。
常见错误包括：
-
cite="张三《前端手记》"—— 非法值，违反 HTML5 规范，被浏览器静默丢弃 -
cite="来源:https://example.com"—— 混入描述性文本，URL 解析失败 -
cite="post.md"—— 相对路径在静态站点或跨域场景下极易 404，语义链断裂
正确做法是只填一个可访问、真实存在的绝对 URL，例如：cite="https://github.com/vuejs/core/blob/main/README.md#reactivity"。
多段引文必须用 <p> 包裹，否则语义失效
<blockquote> 是块级内容模型，HTML5 明确要求其子内容必须是“流内容”，且多段文字不能直接堆叠在标签内——否则会触发验证警告，CSS 也难以精准控制段间距和缩进。
立即学习“前端免费学习笔记（深入）”；
正确结构必须是：
<blockquote cite="https://example.com/article"> <p>第一段引文内容。</p> <p>第二段逻辑独立的内容。</p> </blockquote>
错误写法（无 <p>）会让浏览器自动补全 DOM（可能插入 <div> 或其他节点），但语义模糊、无障碍支持弱、样式不可控。
真正显示出处，得靠 <footer> + <cite>
想让用户在页面上看到“——李四，《现代 HTML 实践》”，cite 属性完全帮不上忙。唯一可靠、语义正确、无障碍友好的方式是手动添加 <footer> 和 <cite>：
-
<footer>必须放在<blockquote>内部末尾，不能在外面 -
<cite>只能包裹作品名（如《HTML5 权威指南》），不能放人名、网址或时间 - 人名、机构名等应直接写在
<footer>里，不套<cite>
示例：
<blockquote cite="https://html.spec.whatwg.org/multipage/grouping-content.html#the-blockquote-element"> <p>The <code><blockquote></code> element represents content that is quoted from another source.</p> <footer>— WHATWG, <cite>HTML Living Standard</cite></footer> </blockquote>
cite 属性不能当超链接用，用户点不到
cite 是 HTML 的元数据属性，只用于声明引用来源的 URI，不参与渲染。即使你写成 <blockquote cite="https://www.php.cn/link/882868f86cbc35c3e7fc151124bfaf0d">…</blockquote>，用户也看不到、点不了那个地址。
主流浏览器均不解析或展示 cite 值，也不提供悬停提示。W3C 明确说明：该属性“仅供机器读取”，不是交互式入口。
真正让溯源 URI 可访问的两种做法：
- 在
<blockquote>内部末尾手动加<p><a href="...">原文链接</a></p> - 用
<footer>包裹来源说明，并在里面嵌套<a>：<footer>来源：<a href="https://example.com">example blog</a></footer>
最容易被忽略的是：你填了合法 URL，但没在页面上显式提供可点击链接——用户根本不知道出处在哪，机器也未必能抓取到；而 cite 属性本身，永远只是后台的一行元数据。
