HTML5 视频标签未播放答案

【问题标题】：HTML5 Video Tag Not PlayingHTML5 视频标签未播放
【发布时间】：2013-01-31 04:47:08
【问题描述】：

我正在尝试利用 HTML5 视频标签在页面加载时自动播放 mov 或 mp4 视频。但是，页面加载时视频未播放。这是我的代码：

<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8" />
<title>Bropocalypse</title>
<style>
body {background:#000000;
margin:100px;}

p {font-size:36px;
text-align:right;
margin:20px 0px;}

a:link, a:hover, a:visited {color:#FF0000;
text-decoration:none;}

.trailer {width:700px;
height:100%;
margin:0 auto;}
</style>
</head>
<body>
<div class="trailer">
    <video width="700" height="400" src="trailer.mp4" poster="trailer.mp4" controls="controls" autoplay="autoplay" type="video/mp4; codecs='avc1.42E01E, mp4a.40.2'">
    <p>If you are reading this, it is because your browser does not support the HTML5 video element.</p>
    </video>
<p><a href="about.php"><img src="images/skip.png" alt="SKIP >>" /></a></p>
</div>
</body>
</html>

可以在此处找到该页面：http://www.tcnj.edu/~moore56/game-design/bropocalypse/。请让我知道您可能有的任何建议或问题。谢谢。

【问题讨论】：

您使用的浏览器是什么版本？
我正在使用 chrome，但我也希望它至少可以在 firefox 中使用。

标签： html

【解决方案1】：

首先，尝试对 HTML5 内容使用 HTML5 doctype，而不是 XHTML 1.0 doctype。

我测试了您的代码，但它对我不起作用，但是，当我用测试 .m4v 视频（来自 here）替换视频时，它立即在我的 Chrome 浏览器上运行，所以问题似乎没有与 HTML 代码一起使用。

另请注意，您正在使用文本/纯内容类型提供视频文件，这是不对的。

【讨论】：

我已经编辑了视频标签的标题和内容类型，但它仍然不起作用。建议？（原帖更新）
好吧，我的意思是问题出在您的视频文件（格式）上。必须是supported format，否则不行。

【解决方案2】：

是的，正如 eis 所说，如果您手动重命名视频格式，它在您的机器上运行良好，但编解码器不匹配，导致视频无法在浏览器中播放。此外，您应该放置一个回放格式和一个对象标签以将视频嵌入到您的浏览器中......

【讨论】：