多媒体标签

视频标签

<video> 标签是HTML5中用于在网页中嵌入视频内容的关键标签。它支持多个 <source> 标签，允许指定不同格式的视频文件，确保跨浏览器兼容性。

视频标签目前支持三种格式：mp4、webm、ogg

<!-- 在 HTML5 里面，如果属性名和属性值完全一样，可以简写为一个单词 -->
<video controls>
	<source
		src="video.mp4"
		type="video/mp4"
	/>
	您的浏览器不支持视频标签。
</video>

标签属性详解

属性	说明
src	定义视频文件的URL路径。可以直接在<video>标签中使用src属性，或者使用<source>标签指定。
controls	显示视频播放控件，包括播放/暂停按钮、音量控制等。
autoplay	允许视频文件自动播放。（谷歌浏览器中需要配合muted实现静音播放）
loop	设置视频文件循环播放。
muted	设置视频文件默认静音播放。
poster	定义视频加载前显示的占位图像（海报图）。
preload	定义视频文件的预加载行为，可以是none、metadata或auto。 none：页面加载时不加载视频。 metadata：页面加载时仅加载视频的元数据（如长度、尺寸）。 auto：页面加载时开始加载整个视频。

音频标签

<audio> 标签是HTML5中用于在网页中嵌入音频内容的关键标签。它支持多个 <source> 标签，允许指定不同格式的音频文件，确保跨浏览器兼容性。

音频标签目前支持三种格式：mp3、wav、ogg

<!-- 在 HTML5 里面，如果属性名和属性值完全一样，可以简写为一个单词 -->
<audio controls>
	<source
		src="audio.mp3"
		type="audio/mpeg"
	/>
	您的浏览器不支持音频标签
</audio>

标签属性详解

属性	说明
src	定义音频文件的URL路径。可以直接在<audio>标签中使用src属性，或者使用<source>标签指定。
controls	显示音频播放控件，包括播放/暂停按钮、音量控制等。
autoplay	允许音频文件自动播放。请注意，由于用户体验和浏览器策略的考虑，某些浏览器可能限制自动播放功能。
loop	设置音频文件循环播放。
muted	设置音频文件默认静音播放。
preload	定义音频文件的预加载行为，可以是none、metadata或auto。 none：页面加载时不加载音频。 metadata：页面加载时仅加载音频的元数据（如长度、尺寸）。 auto：页面加载时开始加载整个音频。