如何在文章中嵌入 YouTube 和 Bilibili 视频

嵌入视频的方法

在 Markdown 文章中，你可以直接使用 HTML 嵌入视频。

YouTube 视频

<div class="video-embed">
  <iframe src="https://www.youtube.com/embed/VIDEO_ID" title="视频标题" allowfullscreen></iframe>
</div>

将 VIDEO_ID 替换为 YouTube 视频 ID（网址中 v= 后面的部分）。

Bilibili 视频

<div class="video-embed">
  <iframe src="https://player.bilibili.com/player.html?bvid=BVxxxxxxx&autoplay=0" title="视频标题" allowfullscreen></iframe>
</div>

将 BVxxxxxxx 替换为 Bilibili 视频的 BV 号。

效果展示

下方是一个 YouTube 嵌入示例（替换为你的视频链接即可）：

添加图片

直接使用 Markdown 语法：

![图片描述](/images/your-image.png)

将图片文件放入 public/images/ 目录，然后用 /images/文件名 引用即可。

发布新文章

1. 在 src/pages/blog/ 下新建 .md 文件
2. 添加 frontmatter（标题、日期、标签等）
3. 编写 Markdown 内容
4. git push 自动部署