HTML5视频必须置于标签内部且结构完整，常见问题包括标签未闭合、路径错误、缺少controls属性、格式不兼容；正确做法是用指定多格式，设max-width:100%适配响应式。
HTML5 视频不能直接“嵌入表格单元格”——表格（）本身只是布局容器，视频需要放在 或 内部的流内容中，且必须用 为什么 | 里？常见错误现象
新手常遇到：视频标签写了但不显示、页面空白、控制栏缺失、报错 Failed to load resource。根本原因通常是：
-
外部（比如漏了 - 视频路径错误：
src 指向了不存在的文件，或用了相对路径但当前 HTML 文件位置和资源目录不匹配（如视频在 /assets/video.mp4，却写成 src="video.mp4"）
- 缺少必要属性：
controls 就看不到播放按钮；没加 width/height 可能被压缩成一条线
-
浏览器不支持格式：只提供
.mp4 通常够用，但若只给了 .webm 或 .ogv，Safari/IE 可能完全不渲染
正确写法：把 |
不需要 CSS 定位、不需要 position: absolute，只要结构合法即可。示例：
注意点：
立即学习“前端免费学习笔记（深入）”；
ReRoom AI
专为室内设计打造的AI渲染工具，可以将模型图、平面图、草图、照片转换为高质量设计效果图。
下载
-
开始与结束标签之间
- 推荐用
src 属性，便于 fallback 和多格式支持
- 加
controls 才有播放/暂停/音量等 UI；加 preload="metadata" 可减少首帧加载延迟
- 如果表格列宽太小，视频会被强制缩放——此时应调
的 width 或用 CSS min-width，而不是硬调 响应式场景下：表格 + 视频容易出问题的地方
当表格设了 width: 100% 或用在移动端时，
- 不要给
width/height，改用 CSS：max-width: 100%; height: auto;
默认是 vertical-align: middle，但视频顶部常有空白——加 vertical-align: top 或 line-height: 0 消除
- 某些旧版 Android 浏览器对表格内
poster 图片支持差，建议统一用 background-image 做占位
- 避免在
或带 rowspan/colspan 的复杂单元格里放视频——DOM 渲染顺序易混乱，调试困难
真正卡住新手的，往往不是语法，而是路径错误 + 缺少 controls + 表格结构意外闭合。先确保视频单独打开能播，再往 | 里塞，比反过来排查快得多。 |
|
|
|
|
|
| |
