HTML5资料之多媒体

HTML5之前，在网页上播放音频/视频的通用方法是利用Flash来播放，但是大多情况下，并非所有用户的浏览器都安装了Flash插件，由此使得处理音频/视频播放变的非常复杂，并且移动设备的浏览器并不支持Flash插件。

◆ 音频播放：

HTML5通过<audio>标签来解决音频播放的问题

<audio src="music/yinyue.mp3"> </audio>

★ 兼容写法：

<audio>
    <source src="music/yinyue.mp3"/>
    <source src="music/yinyue.ogg"/>
    <source src="music/yinyue.wav"/>
    抱歉，你的浏览器不支持音频标签！
</audio>

注：由于版权等原因，不同的浏览器可支持播放的格式是不一样

★ 标签属性：

• autoplay：自动播放
• controls：是否显示默认播放控件
• loop：循环播放

<audio src="music/yinyue.mp3" autoplay controls></audio>

◆ 视频播放：

HTML5通过标签来解决音频播放的问题

<video src="video/movie.mp4"></video>

★ 兼容写法：

<audio loop='loop' autoplay>
    <source src="music/yinyue.mp3"/>
    <source src="music/yinyue.ogg"/>
    <source src="music/yinyue.wav"/>
    抱歉，你的浏览器不支持音频标签！
</audio>

★ 标签属性：

• autoplay：自动播放
• controls：是否显示默认播放控件
• loop：循环播放
• width：设置播放窗口宽度
• height：设置播放窗口的高度

<audio src="music/yinyue.mp3" autoplay controls> </audio>