这篇文章是一个演示页，展示现在博客里能直接在正文中使用的内容组件。
提示
这些组件可以直接写在 .mdx 文章里，不需要额外 import。
1. 提示框
你可以用 Callout 写更醒目的说明块。
注意事项
如果以后你把站点部署到 Vercel 生产环境，直接写本地文件的后台不适合作为长期方案。
2. 图片卡片
你可以插入一张带说明文字的图片卡片：
3. 视频嵌入
如果你有 YouTube、Bilibili 或其他平台的 embed 地址，可以直接插入：
4. 代码高亮
普通 fenced code block 现在会自动高亮：
type Post = {
title: string;
category: string;
tags?: string[];
};
export function PostCard({ title, category, tags }: Post) {
return (
<article>
<h2>{title}</h2>
<p>{category}</p>
{tags?.map((tag) => (
<span key={tag}>{tag}</span>
))}
</article>
);
}以后你就可以把这些组件当成正文工具来写，而不只是写纯 Markdown。