---
title: "媒体嵌入测试：视频与图片"
date: 2026-05-16T12:00:00+08:00
draft: false
description: "测试 Hugo 对 B 站视频嵌入和多种图片格式的渲染效果。包含 iframe 视频播放器、横版图片、内联对比和居中展示，验证移动端和桌面端的布局表现。"
---

这是一篇测试文章，验证 Hugo 对 B 站视频嵌入和图片渲染的支持。

## 嵌入式视频

下面是 B 站视频 BV1AWRVB2EAz 的嵌入播放器：

<div style="position: relative; padding-bottom: 75%; height: 0; overflow: hidden; margin: 1.5rem 0;">
  <iframe
    src="//player.bilibili.com/player.html?bvid=BV1AWRVB2EAz&page=1&high_quality=1&autoplay=0"
    scrolling="no"
    border="0"
    frameborder="no"
    framespacing="0"
    allowfullscreen="true"
    style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">
  </iframe>
</div>

视频通过 B 站官方播放器嵌入，支持弹幕、倍速、画质切换。

## 图片渲染测试

### 横版图片

![AI 主题图](/images/ai.jpg)

### 内联对比

两张图并排展示：

![编程](/images/coding.jpg)

![思考](/images/thinking.jpg)

### 小图居中

![子弹日记](/images/journal.jpg)

---

以上测试覆盖了视频嵌入和多种图片展示场景。如果你在手机或其他设备上看到布局异常，需要针对性调整。