视频元素用于嵌入预录的视频内容（产品介绍、操作演示、案例视频等）。

支持格式

格式	编码	适用
MP4	H.264 / H.265	通用，兼容性最好
WebM	VP9 / AV1	高压缩，新浏览器优先
MOV	H.264	macOS 原生
OGV	Theora	老浏览器兜底

平台会自动转码：上传任意格式后，服务端会生成 MP4 + WebM 双版本，前端自动选最优。

上传与引用

1. 本地上传：单个 ≤ 500MB，平台合计配额按账户级别
2. 平台视频库：左侧面板 →「素材 → 视频」
3. URL 引用：YouTube / Vimeo / 自家服务器（需 CORS 允许）

播放控制属性

右侧面板 → 视频属性：

自动播放：autoplay  ✅ / ❌
循环：       loop      ✅ / ❌
默认静音：   muted     ✅ / ❌（autoplay 时强制 true）
显示控制条：controls   ✅ / ❌
预加载：     metadata / auto / none
开始时间：   startTime  (秒)
结束时间：   endTime    (秒)
播放速度：   0.5 / 0.75 / 1 / 1.25 / 1.5 / 2

自动播放陷阱

浏览器禁止有声自动播放。规则：

场景	行为
autoplay + muted	✅ 自动播放（无声）
autoplay + 有声	❌ 浏览器拦截，需用户首次点击
进入页面后用户点过任意位置	✅ 后续自动播放可有声

最佳实践：autoplay 视频默认 muted，画面上加显眼的"点击解除静音"按钮。

视频章节标记

长视频可加章节书签：

{
  "chapters": [
    { "time": 0,    "label": "开场" },
    { "time": 30,   "label": "功能演示" },
    { "time": 90,   "label": "案例对比" },
    { "time": 150,  "label": "总结" }
  ]
}

观众端进度条上显示标记，点击跳转。

触发器：视频播完进入下一动画

视频元素有一个特殊触发：

视频播完 → 触发后续动画 / 自动翻页

适用：开场短片放完自动进入正文、情境引入后切换到讲解页。

字幕

支持 WebVTT 字幕文件：

上传 .vtt 文件 → 自动关联视频
观众端可切换字幕语言

或用 AI-6 实时字幕（需付费），详见「54. AI-6 实时字幕」。

性能建议

视频时长	建议
< 30s	直接嵌入
30s – 2 min	推荐使用
2 – 10 min	用章节标记导航
> 10 min	拆短，或外部播放器（YouTube）

单页视频 ≤ 1 个最佳。多个视频在同页面时只播一个，其它暂停。

内嵌音频

如果只想加音频（背景音乐 / 旁白），用单独的「音频元素」：

• 同样支持 MP3 / WAV / OGG
• 可选播放图标（音符 / 自定义按钮 / 不可见）
• autoplay + loop 适合背景音乐

下一节讲 GGB 动画元素（详见 14 章）。