HTML5多媒体标签和视频标签

HTML5多媒体标签和视频标签

1. 多媒体标签
   音频标签 <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> 

2. 视频标签
   视频标签 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”(静音播放)