在 HTML 中的 div 中播放视频
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14566303/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Play video in a div in HTML
提问by Calm Sea
I'm trying to play a video in a div tag in html but when I used the following code, the browser asked if I want to download the video. I do not want to download it, I just want to play it. Also this message appeared in the div
我正在尝试在 html 的 div 标签中播放视频,但是当我使用以下代码时,浏览器询问我是否要下载视频。我不想下载它,我只想玩它。此消息也出现在 div 中
"You need to install an extension to view this content"
“您需要安装扩展程序才能查看此内容”
I'm using firefox browser
我正在使用火狐浏览器
This what I used in html file :
这是我在 html 文件中使用的:
<div>
<object type="Brave/quicktime" data="Brave.avi" width="624" height="352">
<param name="pluginurl" value="http://www.apple.com/quicktime/download/" />
<param name="controller" value="false" />
<param name="autoplay" value="true" />
</object>
</div>
回答by zazvorniki
Try using the video tag
尝试使用视频标签
<div>
<video width="700" height="450" controls="controls" poster="image" preload="true">
<source src="where the video is" type="video/mov"/>
<source src="where the video is" type="video/mp4" />
<source src="where the video is" type="video/oog" />
Your browser does not support the video tag.
</video>
</div>
You also need to use a different video type. AVI file types are not supported in the html5 video tag.
您还需要使用不同的视频类型。html5 视频标签不支持 AVI 文件类型。
回答by Matt Stephens
Try this
尝试这个
<video width="624" height="352" controls>
<source src="Brave.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
Also i wouldn't use AVI as the format for the video.
此外,我不会使用 AVI 作为视频格式。
Use MP4 then you can use the HTML5 video tag.
使用 MP4 然后你可以使用 HTML5 视频标签。
回答by Jules
Your main problem is that you're using an invalid MIME type (as you've pointed out yourself, the browser returns an "invalid MIME type" message). You're also using the <object>
tag, which is deprecated as of HTML5.
您的主要问题是您使用了无效的 MIME 类型(正如您自己指出的那样,浏览器返回“无效的 MIME 类型”消息)。您还使用了<object>
自 HTML5 起已弃用的标记。
Before using up-to-date markup, make sure your DOCTYPE
declaration reads, <DOCTYPE html>
, and nothing more. This tells the browser that you're using an HTML5 document, and that the proper tag definitions should be loaded. If you declare an HTML4 DOCTYPE
, your browser might not be able to process HTML5 tags.
在使用最新的标记之前,请确保您的DOCTYPE
声明内容为 、<DOCTYPE html>
,仅此而已。这告诉浏览器您正在使用 HTML5 文档,并且应该加载正确的标签定义。如果您声明 HTML4 DOCTYPE
,您的浏览器可能无法处理 HTML5 标签。
Once that's done, use the <video>
tag. Now, your markup should look something like this:
完成后,使用<video>
标签。现在,您的标记应如下所示:
<DOCTYPE html>
<html>
<head>
<!-- your styles, scripts, and other head info -->
</head>
<body>
<video src="Brave.avi" controls="yourControls" autoplay="false">
Your browser doesn't support the `<video>` tag. /*this is a fallback*/
</video>
</body>
<html>
You'll notice that there's no type
attribute for the <video>
tag. That's because the <video>
tag doesn't actually support that attribute. This makes for less coding, which is always a good thing.
您会注意到标签没有type
属性<video>
。这是因为该<video>
标签实际上不支持该属性。这使得编码更少,这总是一件好事。
On a side note, avoid using the .avi
format. The h264 codec just became an official standard, which means that using .mp4
, or even the oft-neglected .ogg
format are preferable, as they use less bandwidth, and are more widely supported.
附带说明一下,请避免使用该.avi
格式。h264 编解码器刚刚成为官方标准,这意味着使用.mp4
,甚至经常被忽视的.ogg
格式是更可取的,因为它们使用更少的带宽,并且得到更广泛的支持。