在 iframe 中添加视频标签答案

【问题标题】：Adding Video Tag in iframe在 iframe 中添加视频标签
【发布时间】：2014-12-31 08:19:49
【问题描述】：

我在 Div 中有一个 iframe，我想在其中添加视频。我已经正确添加了视频的 URL 路径，但没有在屏幕上显示视频，我在浏览器控制台上也没有收到任何错误。这是整个 HTML ..

<div style="position:relative; width: 100%; height: 0; padding-bottom: 56.25%;">
<iframe width="420" height="315" frameborder="0" allowfullscreen style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;">
 <video id='video-player' autoplay preload='metadata' controls>
  <source src="Video/Sapno.MP4" type="video/mp4">
</video>
</iframe>
</div>

请帮助我在我的网站上显示视频..谢谢..

【问题讨论】：

标签： html iframe html5-video

【解决方案1】：

您不需要在此处使用 iframe，如果您删除 iframe，它将起作用，如果您出于任何原因需要 iframe，则需要将“src”属性放在 iframe 中并带有视频链接。

<div style="position:relative; width: 100%; height: 0; padding-bottom: 56.25%;">
 <video id='video-player' autoplay preload='metadata' controls>
  <source src="Video/Sapno.MP4" type="video/mp4">
</video>
</div>

【讨论】：

我试过你的这个代码，我可以看到视频，但我必须使用 iframe 使这个视频适合我的网站..你能给我提供那个代码吗..谢谢
尝试这样的事情：
我试过这段代码，但是我的视频会自动下载..但视频没有显示在网页中..请参阅下面发布的代码示例..
<div style="position:relative; width: 100%; height: 0; padding-bottom: 56.25%;"><iframe width="420" height="315" src="Video/Sapno.MP4" frameborder="0" allowfullscreen style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"></iframe>

【解决方案2】：

制作一个包含<video> 元素的单独HTML 页面（比如second.html），然后在iframe 中调用该页面，如下所示：<iframe src="second.html" ... ></iframe>。希望对您有所帮助。

【讨论】：

【解决方案3】：

<video src="/video/demo.mp4" width="200" height="100" controls>

<p>If you are reading this, it is because your browser does not support the HTML5 video element.</p>
</video>

【讨论】：