HTML5多媒体标签和视频标签
程序员文章站
2022-05-11 08:14:36
...
HTML5多媒体标签和视频标签
- 多媒体标签
音频标签<audio src="文件地址" controls="controls"></audio>
支持格式有限,主要支持三种格式
1.Ogg Vorbis(常用)
2.MP3(常用)
3.Wav
属性:
1.autoplay=“autopaly”(音频在就绪后马上播放,谷歌浏览器禁用了自动播放)
2.controls=“controls”(向用户显示控件,比如播放按钮,不同浏览器显示控件不同)
3.loop=“loop”(音频结束时重新开始播放)
4.src=""(要播放的文件名)
因为不同浏览器支持不同格式,我们需要为这个音频准备多个格式
<audio controls="controls">
<source src="happy.mp3" type="audio/mpeg">
<source src="happy.ogg" type="audio/ogg">
您的浏览器不支持audio标签
</audio>
- 视频标签
视频标签 video
格式:
1.Ogg(常用)
2.MPEG 4(常用)
3.WebM
解决兼容性:
<video controls="controls">
<source src="move.ogg" type="video/agg">
<source src="move.mp4" type="video/mp4">
您的浏览器不支持video标签
</video>
常见属性:
autoplay=“autoplay”(自动播放,谷歌禁止自动播放,需添加muted=“muted”(静音播放)属性才能自动播放)
controls=“controls”(显示播放控件)
width="…px"(播放器宽度)
height="…px"(播放器高度)
loop=“loop”(循环播放)
preload=“proload”(是否等加载完再播放)
src=“url”(视频地址)
poster=“imgurl”(加载等待的画面图片)
muted=“muted”(静音播放)
上一篇: 各种数据库的SQL的不同点
下一篇: MySQL数据库系统参数的优化