关于 docs-page
用于制作 API 或教程文档单页的设计技能,侧重长文阅读体验。页面包含固定侧栏导航、正文与滚动目录,并提供搜索、版本和主题切换等顶栏元素。
主要功能
- 01固定的侧栏章节导航
- 02含代码块、提示框和表格的正文
- 03滚动跟随目录
- 04顶栏搜索与版本显示
- 05主题切换
适用场景
- 01设计 API 参考文档页面
- 02制作带目录的技术教程
- 03为长文档添加章节导航和搜索
安装
复制下面的命令,在终端中运行。
$
npx skills add https:/ / github.com/ nexu-io/ html-anything --skill docs-page安装后在 Claude Code 中输入/docs-page确认已加载。
附带文件example.html
README 原文English
来自项目 READMEREADME 暂无中文译文,以下为英文原文;中文介绍见上方。
【模板: 技术文档页】 【意图】API / 教程文档单页, 长读体验优先。 【布局】
- Inline-start nav (sections + sticky)
- Article body (含代码块, callouts, 表格)
- Inline-end TOC (sticky, scroll-spy)
- 顶栏 search + version + 主题切换 【设计细节】
- 代码块: 圆角 + dark + 语言标签 + 复制按钮
- callout: info / warn / danger 三色
评论
支持 Markdown