Obsidian 语法测试 - Obsidian 风格

测试 Obsidian callouts 和高亮语法 - 采用类似 Obsidian 的卡片风格

Obsidian Callouts(类似 Obsidian 的卡片风格)

[!NOTE] 这是一个基础的 Note callout,现在使用类似 Obsidian 的卡片风格设计。

[!TIP] 自定义标题的提示 这是带有自定义标题的 Tip callout,具有独特的颜色和图标。

[!WARNING] 这是一个警告类型的 callout,使用橙色主题。

[!DANGER] 这是一个危险类型的 callout,使用红色主题表示严重警告。

[!ERROR] 这是一个错误类型的 callout,同样使用红色主题。

[!SUCCESS] 这是一个成功类型的 callout,使用绿色主题表示积极信息。

[!QUESTION] 这是一个问题类型的 callout,使用紫色主题。

[!EXAMPLE] 这是一个示例类型的 callout,使用青色主题展示示例内容。

[!BUG] 这是一个 Bug 类型的 callout,用于标记已知问题。

[!QUOTE] 这是一个引用类型的 callout,适合展示引文或重要声明。

原生 Blockquote

这是普通的 blockquote 用于对比:

这是一个标准的 blockquote

它使用 Stack 主题的原生样式

与 Obsidian callouts 形成对比

Obsidian 高亮语法测试

这是一段包含 ==高亮文本== 的段落,应该显示为黄色背景。

普通文本 ==重要信息== 更多普通文本 ==另一个高亮== 结束。

多个高亮在同一行:==第一个== 和 ==第二个== 和 ==第三个==。

==整段高亮的文字可能会很长,用来测试换行和样式的表现==。

Mermaid 图表

graph TD A[Obsidian 风格] --> B[更好的视觉体验] A --> C[卡片式设计] B --> D[完美的用户体验] C --> D E[高亮语法] --> F[重要信息] F --> G[视觉突出] G --> H[增强可读性]

现在的 Obsidian callouts 采用了类似 Obsidian 的卡片风格,提供更好的视觉层次和用户体验!

图片功能测试

基础图片(自适应大小)

测试图片
测试图片
测试图片
测试图片

指定宽度的图片

指定宽度:100|100
指定宽度:100|100
指定宽度:400|400
指定宽度:400|400

指定宽高的图片

指定宽高:100x900|100x300
指定宽高:100x900|100x300
指定宽高:300x100|300x100
指定宽高:300x100|300x100

小尺寸内联图片

这是一段文字

小图标:100|100
小图标:100|100
小图标:50|50
小图标:50|50
包含小图片的演示。

图片功能说明

  • 自适应大小:图片会根据容器宽度自动调整
  • 响应式设计:在不同设备上都有良好的显示效果
  • 点击放大:点击图片可以全屏查看
  • 尺寸控制:支持 Obsidian 风格的尺寸语法 ![alt|width]![alt|widthxheight]
  • 图片说明:自动显示图片的 alt 文本作为说明
  • 阴影效果:图片有精美的阴影和悬浮效果
  • 默认大小:400px自适应