【前端基础入门】学习笔记（三）——HTML5新特性之视频和音频

---

日期：2020.2.19
大纲：
一、音频文件标准
二、视频文件标准

---

一、音频文件标准

HTML5提供了音频对应的标准，使用< audio>标签。【支持文件格式：mp3、wav、ogg】

• src-播放的音频路径
• controls-控制面板的显示和隐藏
• autoplay-自动播放
• loop-循环播放

	<audio controls>
	<source src="horse.mp3" type="audio/mpeg">
	<source src="horse.ogg" type="audio/ogg">
	</audio>

二、视频文件标准

HTML5提供了视频对应的标准，使用< video>标签。【支持文件格式：mp4、WebM、Ogg】

• controls-控制器是否显示。
• autoplay-自动播放。
• loop-循环播放。
• height width-视频的宽高，一般只需设置一个宽或者高，另外一个宽高会自动适应。
• poster-视频下载时显示的图像，或者在用户点击播放按钮前显示的图像。
• source-兼容性处理模式。
• muted-视频的音频输出应该被静音。
• preload-页面加载时记载并预备播放。

	<video width="160" height="120" controls>
		<source src="movie.mp4" type="video/mp4">
		<source src="movie.ogg" type="video/ogg">
		<source src="movie.webm" type="video/webm" />
	</video>