如何从我的计算机将视频嵌入到 HTML 文档中？答案

【问题标题】：How to embed a video in an HTML document from my computer?如何从我的计算机将视频嵌入到 HTML 文档中？
【发布时间】：2019-07-30 11:31:39
【问题描述】：

我正在尝试将我的 MacBook 中的视频附加到括号代码编辑器中的 HTML 5 网页，但视频未在浏览器 (chrome) 中播放，而视频的框和控件可见。视频存储在我硬盘驱动器上名为视频的文件夹之一中。

尝试使用 mpeg 扩展名代替 mp4，并尝试在 src 属性中使用不同的路径。还尝试使用在代码下方注释的第二个源标记。

<body>
<video controls>
<source src="video1.mp4" type="video/mp4"> 
<!--<source src="video1.ogg" type="video/ogg">-->
</video>
</body>

一切都很好，包括盒子、控件，但只有视频没有播放。

【问题讨论】：

是的，请检查一下，我忘了添加它
视频和html文件在同一个文件夹吗？
不，他们不是
如果它们位于不同的文件夹中，并且您的代码如上所示 - 您的路径无效。否则，当您直接输入视频时（通过完整的 url？），您可以在浏览器中播放视频吗？因为看起来播放器已正确创建，但浏览器无法播放文件（无效的编解码器等）您是否检查了浏览器控制台 (F12) 是否有任何消息/警告？
是的，你是对的，但现在我明白了......

【解决方案1】：

您在src属性中写的路径是相对于html文件的位置，您需要确保视频在同一个文件夹中，或者路径指向视频所在的文件夹存储。

例子：

如果视频存储在与您的 html 文件位于同一文件夹中的 videos 文件夹中：

src="videos/video1.mp4"

你也可以提供多种格式的src --

<video controls> 
    <source src="videos/video1.ogg" type="video/ogg">
    <source src="videos/video1.mp4" type="video/mp4">
</video>

【讨论】：