界面增强演示

这是一篇只放在网站仓库中的演示笔记，用来检查图片预览、代码复制、阅读进度、目录跟随、搜索卡片和中文属性显示。

1. 图片点击放大

点击下面的图片，可以打开大图预览；再次点击背景或右上角的“×”即可关闭。

2. 代码块复制

将鼠标移动到代码块右上角，点击“复制”，按钮会短暂显示“已复制”。

type Note = {
  title: string
  tags: string[]
  published: boolean
}
 
const note: Note = {
  title: "界面增强演示",
  tags: ["网站", "UI", "测试"],
  published: false,
}
 
console.log(`${note.title}: ${note.tags.join("、")}`)

3. 数学公式

公式内容仍然使用 KaTeX 渲染：

$$\mathbf{Ax}=\mathbf{b},\Vert \mathbf{x}{\Vert }_2=\sqrt{\sum _{i=1}^n{x}_i^2}$$

4. 目录滚动跟随

下面增加几个小节，让右侧目录足够长，便于观察当前标题高亮和目录自动滚动。

4.1 第一组说明

目录中的当前标题会随着阅读位置变化而突出显示。

4.2 第二组说明

桌面端右侧目录会保持在可视区域内；移动端按照响应式布局处理。

4.3 第三组说明

返回顶部按钮会在页面向下滚动后出现，点击后平滑回到文章开头。

4.4 第四组说明

顶部阅读进度条会根据文章滚动位置变化。

5. Wiki 链接与提示框

这是一个 Wiki 链接示例：界面增强演示。如果以后链接到其他公开笔记，仍然可以保留 Obsidian 的双括号写法。

本地预览提示

这篇笔记是网站仓库中的临时测试内容，不来自私人 Obsidian 知识库。正式发布前可以直接删除。

6. 预览清单

• 中文面包屑与“笔记属性”标题
• 图片点击放大
• 代码块复制按钮
• 返回顶部按钮
• 阅读进度条
• 目录滚动跟随
• 搜索结果路径信息