705 字
4 分钟
Markdown 内容注释
内容注释比传统脚注更轻:正文里放一个标记,说明文字在宽屏显示为右侧边缘的旁注卡片,窄屏/触屏轻触标记唤出浮层。
基础用法
效果:Astro 采用孤岛架构 来保持页面的极速加载。
源码(标记是 [+标签],定义是 [+标签]: 换行后缩进 2 个空格)
Astro 采用孤岛架构 [+islands] 来保持页面的极速加载。
[+islands]: 孤岛架构指由静态 HTML 所包裹的独立交互组件区域,只有交互区域才加载 JavaScript。一段里放多个标记
效果:本站内容分离成两个仓 ,构建与部署交给托管平台 ,评论则放在另一个公开仓的 Discussions 里 。
源码
本站内容分离成两个仓 [+two-repos],构建与部署交给托管平台 [+deploy]。
[+two-repos]: 代码仓放主题与自研功能,内容仓放文章、动态与个人配置,两者互不污染。
[+deploy]: 内容仓推送后由平台侧自动重建站点,不需要手动跑构建命令。写法要点
| 项 | 规则 |
|---|---|
| 行内标记 | [+标签],1 个加号、方括号紧贴、无空格 |
| 定义块 | [+标签]: 冒号后不写内容、直接换行 |
| 定义正文 | 下一行起,缩进 2 个空格 |
| 同名定义 | 同一标签可以累积多条定义 |
| 生效范围 | 仅当前文章 |
边界行为(本仓实测)
- 未定义的引用会原样保留:正文里写 [+undefined-tag] 只会显示为普通文本,不会生成标记;
- 定义但没人引用的注释不会输出到正文,定义块本身也不渲染;
- 标记与链接、代码、强调等行内语法相邻组合都可以;
- 注释内容是服务端输出的静态 HTML,对爬虫与无障碍访问都友好。
查看方式:宽屏下把页面拉宽能看到右侧旁注,缩窄窗口后改为轻触标记弹出浮层——两种布局都实现过,可以拖动浏览器宽度对比。
分享文章
生成精美分享图或复制链接,与更多人分享本文。
继续阅读
换条路线
从其他文章中稳定抽取
最后更新于 ,距今已过 301 天
部分内容可能已过时
评论