html5怎么插入视频？视频如何插入页面

最新推荐文章于 2025-05-10 09:16:58 发布

原创最新推荐文章于 2025-05-10 09:16:58 发布 · 744 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#html #音视频 #前端

html5 同时被 3 个专栏收录

168 篇文章

订阅专栏

网页视频播放器

58 篇文章

订阅专栏

酷播云（免费云存储）

56 篇文章

订阅专栏

HTML5 的功能强大，基本所有的静态效果都可以在此轻松呈现，各种视频网站内有大量的视频内容，本篇文章教你如何在 html 中插入视频.

代码如下：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>video (www.cuplayer.com)</title>
<style>
</style>
</head>
<body>
    <video width="320" height="240" controls>
        <source src="/statics/demosource/movie.mp4"  type="video/mp4">
        <source src="/statics/demosource/movie.ogg"  type="video/ogg">
        您的浏览器不支持 HTML5 video 标签。
    </video>
</body>
</html>

标签定义和使用说明

<video>标签定义视频，类似电源片段和其他视频流。

<video>目前为止支持三种视频格式：Ogg、WebM、MP4

浏览器	MP4	WebM	Ogg
Internet Explorer	YES	NO	NO
Chrome	YES	YES	YES
Firefox	YES 从 Firefox 21 版本开始 Linux 系统从 Firefox 30 开始	YES	YES
Safari	YES	NO	NO
Opera	YES 从 Opera 25 版本开始	YES	YES