应使用标准HTML组合实现脚注链接:用包裹编号、嵌套其中或外包,配合id锚点;id需全局唯一且非纯数字,href须大小写匹配;CSS需调整font-size和vertical-align并处理连续脚注间距及键盘导航焦点。

脚注链接用 <a></a> 标签时,_SUP 不是标准 HTML 或 Markdown 语法
浏览器不识别 _SUP 这种自定义标签,直接写会当成普通文本或被忽略。真要实现上标编号 + 点击跳转参考文献,得靠标准 HTML 组合:<sup></sup> 包裹编号,<a></a> 套在外面或里面,再配合 id 锚点。
<sup></sup> 和 <a></a> 怎么嵌套才不出错
两种主流写法都可行,但语义和可访问性有差别:
-
<a href="#ref1"><sup>1</sup></a>:点击整个上标区域跳转,屏幕阅读器会读作“链接,上标 1”,推荐 -
<sup><a href="#ref1">1</a></sup>:语义更清晰(上标内含链接),但部分旧版 iOS Safari 对<sup></sup>内嵌交互元素支持不稳定 - 别写成
<sup><a href="#ref1"><sup>1</sup></a></sup>—— 嵌套<sup></sup>会导致字体异常缩放、行高错乱
参考文献锚点必须用 id,不能只靠 name
HTML5 已废弃 name 属性用于锚点,只认 id。以下写法无效:
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面,使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力: - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面; - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”; - 提及位于 `apps/console/src/featur
<a name="ref1">[1] Author, Title...</a>
正确写法是:
<p id="ref1">[1] Author, Title...</p>
-
id值需全局唯一,避免用纯数字如id="1"(部分浏览器解析异常),推荐id="ref1"或id="cite-2024-001" - 如果参考文献在另一个页面,链接要写全路径:
href="refs.html#ref1" - 注意大小写敏感:
id="Ref1"和href="#ref1"不匹配
样式微调常被忽略的三个细节
默认 <sup></sup> 上标字号偏小、基线偏高,和正文对不齐:
- 加
vertical-align: baseline;可缓解跳动感,但可能影响行高 —— 更稳妥是统一用 CSS 控制:sup { font-size: 0.8em; vertical-align: super; } - 多个连续脚注如
<sup><a>1</a></sup><sup><a>2</a></sup>之间没空隙,易误读为 “12”,建议加margin-right: 0.1em; - 键盘 Tab 导航时,
<a></a>默认有 outline,若用outline: none去掉,必须补足焦点可见性(比如加box-shadow),否则不符合无障碍要求
id 拼错、<sup></sup> 嵌套过深、或者忘了给链接加 href。

















