组件呈现

使用外观菜单切换 Paper、Slate、Ink、Terminal 及明暗模式，比较同一批内容的呈现。以下示例继续沿用通常的 Markdown 写作方式。

相关页面

• 创建站点

  安装主题，在本地预览第一个页面。

• 配置站点

  设置导航、语言、外观和搜索。

紧凑的资源目录可以使用 {.cards .td-cards-list}。分隔列表共用一个外框，说明文字可以自然换行。

• 创作内容 — 组织文章、指南和发布说明，另见 配置指南。
• 标题较长的组件参考入口 — 选择原生 Markdown 或组合短代码。

需要图标、徽章或块级说明时，完整形式支持 cards variant="list"：

提示与折叠块

标签页与命令

brew install hugo

sudo apt install hugo

单行围栏代码块加上 {class="td-code-command"} 后显示为命令条。复制按钮独占一列，命令可以滚动或换行，不会被按钮遮挡。

hugo server --bind 127.0.0.1 --port 1313

hugo --environment production --baseURL https://example.com/documentation/ --destination public

wrap、copy 和无障碍标签保持原有含义。多行、带行号或可折叠的输入会给出警告并回退到普通代码块。没有该修饰类的单行代码块保留通常的呈现。

短流程

在简短有序列表后添加 {.steps .td-steps-compact}。较长教程仍可使用常规 .steps 布局。

3. 检查配置。
4. 运行本地预览。
5. 检查生成结果。

需要标题的流程使用百分号分隔的 steps variant="compact"：

表格与元信息

预览 已验证 待检查

用 Ctrl+ 加 K 打开搜索，用方向键切换结果。

兼容性

这些变体不加载额外运行时。已有链接、键盘操作、复制文字、打印内容与 Markdown 输出保持原有含义。不支持的 cards 或 steps 变体会给出警告并使用常规呈现。视觉精修不改变默认预设或字体政策。