html5组件是什么,HTML5多媒体组件

如今的每一个网站都离不开视频，视频可以生动形象直接的展示内容，在Html时代，都是采用flash来完成的，而flash天生具有很多次缺点，加载慢，兼容性不好，成本高，最重要的是必须要使用插件才能完成播放，用户体验不好。而HTML5新增的多媒体组件video标签，有效的解决了如上的问题，今天我们来学习HTML5新增的多媒体组件视频标签。

HTML5多媒体组件

多媒体组件

多媒体视频组件

在HTML5的网页中，想要添加一个视频只需使用标签即可，我们先看下网页的结构：

欢迎关注头条号/自学编程

*{margin:0;padding:0}

运行以上代码：

HTML多媒体组件

在以上的代码中，我们使用了双标签来加载1.mp4视频，这个标签具有如下的属性：width：定义视频在网页上宽度，以像素为单位

height：定义视频在网页上的高度

autoplay，指定视频在网页一打开时自动播放

loop，视频播放完成后是否循环播放

controls，是否显示默认的播放控件，若不指定这个属性，添加的视频将不能控制播放

没有指定controls属性

7.poster，指定视频在没有播放时的封面图片，记得不是视频的第一帧哦，若视频已经添加了loop属性，则poster属性不显示，如下所示

指定poster属性

8.source，指定视频的路径，为了兼容所有的浏览器，建议使用source属性添加不同格式的视频

以上就是多媒体组件的视频标签介绍，下面我们来学习多媒体组件的音频标签的使用

多媒体音频组件

欢迎关注头条号/自学编程

*{margin:0;padding:0}

音频的属性和视频的一样。今天就分享到这里，喜欢点关注