最近学习工作上经常用到AI(如下图)，因为经常涉及很多对话，通过截图的方式保存或者分享一来显得比较长，二来没办法复制粘贴文字到其他地方，通过网页分享链接出来可读性太差，导出文本又会产生大量格式上的不兼容看起来很乱，所以就写了一个AI对话的样式，方便将对话记录下来自己阅读或者分享给他人

原理

核心原理呢就是Obsidian的Callouts块，官网在这里，有点像博客里经常用到的标签块

Obsidian内置了几种类型的Callouts块，同时还支持自定义类型，通过添加自定义类型的Calouts名称，以及对应的icon，title，text样式，就可以创造自己的Callouts类型，拢共只需要写点css，还是比较方便简单的

演示

演示和教程是用Obsidian写的，正好用这个样式展现出来，然后导出html托管到了Vercel上，嵌入到下面，这样保留了原生样式还可以交互。