audio标签的controls属性_【HTML 教程】多媒体标签

最新推荐文章于 2021-01-05 10:51:39 发布

weixin_39575007

最新推荐文章于 2021-01-05 10:51:39 发布

阅读量1.8k

点赞数

文章标签： audio标签的controls属性

本文链接：https://blog.csdn.net/weixin_39575007/article/details/112368570

版权

本文详细介绍了HTML audio标签的使用，重点讲解了controls属性的作用和应用场景。此外，还涵盖了音频播放的相关属性，如autoplay、loop、muted、src等，以及如何设置音频的元数据、字幕和响应式设计。

摘要由CSDN通过智能技术生成

作者 | 阮一峰 除了图像，网页还可以放置视频和音频。

标签是一个块级元素，用于放置视频。如果浏览器支持加载的视频格式，就会显示一个播放器，否则显示内部的子元素。

<video src="example.mp4" controls>
<p>你的浏览器不支持 HTML5 视频，请下载<a href="example.mp4">视频文件a>。p>
video>

上面代码中，如果浏览器不支持该种格式的视频，就会显示内部的文字提示。有以下属性。

src：视频文件的网址。
controls：播放器是否显示控制栏。该属性是布尔属性，不用赋值，只要写上属性名，就表示打开。如果不想使用浏览器默认的播放器，而想使用自定义播放器，就不要使用该属性。
width：视频播放器的宽度，单位像素。
height：视频播放器的高度，单位像素。
autoplay：视频是否自动播放，该属性为布尔属性。
loop：视频是否循环播放，该属性为布尔属性。
muted：是否默认静音，该属性为布尔属性。
poster：视频播放器的封面图片的 URL。
preload：视频播放之前，是否缓冲视频文件。这个属性仅适合没有设置autoplay的情况。它有三个值，分别是none(不缓冲)、metadata(仅仅缓冲视频文件的元数据)、auto(可以缓冲整个文件)。
playsinline：iPhone 的 Safari 浏览器播放视频时，会自动全屏，该属性可以禁止这种行为。该属性为布尔属性。
crossorigin：是否采用跨域的方式加载视频。它可以取两个值，分别是anonymous(跨域请求时，不发送用户凭证，主要是 Cookie