零基础学习HTML(25)——video标签

最新推荐文章于 2024-09-01 15:02:55 发布

Dragon水魅

最新推荐文章于 2024-09-01 15:02:55 发布

阅读量2.3k

点赞数

分类专栏：零基础学习Web开发文章标签： html

本文链接：https://blog.csdn.net/qq_43650934/article/details/108954294

版权

零基础学习Web开发专栏收录该内容

45 篇文章 2 订阅

订阅专栏

注：学习笔记基于小甲鱼学习视频，官方论坛：https://fishc.com.cn/forum.php

官方资料

鱼C课程案例库：https://ilovefishc.com/html5/
html5速查手册：https://man.ilovefishc.com/html5/
css速查手册：https://man.ilovefishc.com/css3/

学习正文

video标签：https://man.ilovefishc.com/pageHTML5/video.html

可以使用 viedo 标签向浏览器嵌入视频：

<!DOCTYPE html>
<html>
<head>
    <title>在网页中嵌入视频</title>
    <meta charset="utf-8">
</head>
<body>
    <video src="一分一秒.flv" width="640" height="352" controls autoplay>本视频无法播放……</video>
</body>
</html>

经过测试，Google Chorme不会自动播放（但会在静音的情况下自动播放）
在这里插入图片描述
可以使用 video 的 poster 属性设置视频封面：

<!DOCTYPE html>
<html>
<head>
    <title>在网页中嵌入视频</title>
    <meta charset="utf-8">
</head>
<body>
    <video src="一分一秒.flv" width="640" height="352" controls autoplay poster="normal.jpg">本视频无法播放……</video>
</body>
</html>