零基础HTML入门教程(13)——插入视频video标签

最新推荐文章于 2024-04-28 09:59:51 发布

程序员大宁

最新推荐文章于 2024-04-28 09:59:51 发布

阅读量5.5k

点赞数 7

分类专栏： HTML篇文章标签：音视频 ffmpeg html css

本文链接：https://blog.csdn.net/weixin_61808806/article/details/128207011

版权

HTML篇专栏收录该内容

23 篇文章 0 订阅

订阅专栏

本章目录

1.任务目标

我们前几小结学习了，插入图片插入音频等，我们这一小结学习一下，插入视频标签video并熟练使用。

2.video标签

(1)直到现在，仍然不存在一项旨在网页上显示视频的标准。
今天，大多数视频是通过插件（比如 Flash）来显示的。然而，并非所有浏览器都拥有同样的插件。
HTML5 规定了一种通过 video 元素来包含视频的标准方法。
(2)controls 属性供添加播放、暂停和音量控件。
包含宽度和高度属性也是不错的主意。
在这里插入图片描述

3.代码演示

代码如下

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
  <!-- 插入视频，src是视频路径 -->
<video src="./1c70db8357cd0eb7684291df4883ceb7.mp4" controls  width="500px" height="500px"></video>
</body>

</html>

效果如下
在这里插入图片描述

4.小结

我们可以看到，页面上面会出现一个可以播放的视频，我们再一些网站上看到视频，都是用这个标签写的，我们要学会熟练运用这些标签。

程序员大宁

关注

7
点赞
踩
29

收藏

觉得还不错? 一键收藏
1
评论
零基础HTML入门教程(13)——插入视频video标签

我们前几小结学习了，插入图片插入音频等，我们这一小结学习一下，插入视频标签video并熟练使用。(1)直到现在，仍然不存在一项旨在网页上显示视频的标准。今天，大多数视频是通过插件（比如 Flash）来显示的。然而，并非所有浏览器都拥有同样的插件。HTML5 规定了一种通过 video 元素来包含视频的标准方法。(2)controls 属性供添加播放、暂停和音量控件。包含宽度和高度属性也是不错的主意。代码如下效果如下我们可以看到，页面上面会出现一个可以播放的视频，我们再一些网站上看到视频，都是用
复制链接

扫一扫