HTML中的音视频

视频和音频

(1)、Audio(音频) 如需在 HTML5 中播放音频，你需要使用以下代码：

<audio controls>

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

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

Internet Explorer 8 及更早IE版本不支持 <audio> 元素.

Chrome在2018年10月份更新后关闭了audio、video媒体autoplay自动播放。

</audio>

HTML5 中的新属性

video元素定义视频 audio元素定义音频 controls属性：用户显示控件，比如播放按钮。 autoplay属性：自动播放。

注意：

1.视频：自动播放需要配合静音属性一起使用才有效果

2.音频：自动播放需要配合静音属性一起在chrome中没有效果，在火狐/老版IE9以上有效果 loop属性：重复播放属性。 muted属性：静音属性。

预备加载preload="auto"

poster属性：规定视频正在下载时显示的图像，直到用户点击播放按钮。

属性	值	描述
autoplay	autoplay	如果出现该属性，则视频在就绪后马上播放。需要和静音一起用才会生效
controls(控制）	controls	如果出现该属性，则向用户显示控件，比如播放按钮。
height	pixels	设置视频播放器的高度。
loop	loop	如果出现该属性，则当媒介文件完成播放后再次开始播放。
muted	muted	如果出现该属性，视频的音频输出为静音。
poster	URL	规定视频正在下载时显示的图像，直到用户点击播放按钮。
preload	auto	如果出现该属性，则视频在页面加载时进行加载，并 预备播放。如果使用 "autoplay"，则忽略该属性。
srcNew	URL	要播放的视频的 URL。
width	pixels	设置视频播放器的宽度。

 

 

(2)、Video(视频) 如需在 HTML5 中播放视频，你需要使用以下代码：

<video width="320" height="240" controls>

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

  <source src="movie.ogg" type="video/ogg">

您的浏览器不支持Video标签。

</video>

 

---

 

h5新的元素

	标签	描述
	<audio>	定义音频内容
	<video>	定义视频 （ video或者  movie）
	<source>	定义多媒体资源<video> 和<audio>
	<embed>	定义嵌入的内容，比如插件。
	<track>	为诸如  <audio>和<video> 元素之类的媒介规定外部文本轨道。