8-音视频标签¶

视频标签¶

video

<video src="api/images/bn1WHZWMiHaO/movie.mp4" controls autoplay muted loop></video>

属性：

src：视频的URL
controls：是否显示控制条
autoplay：是否自动播放
loop：是否循环播放
muted：是否静音
poster：视频封面

兼容写法¶

<video>
    <source src="api/images/EjWqIXCqcLhS/movie.webm" type="video/webm">
    <source src="api/images/bn1WHZWMiHaO/movie.mp4" type="video/mp4">
    <source src="api/images/pSC6mJlG7aSs/movie.ogg" type="video/ogg">
    <!-- 如果都检测不到就显示 -->
    您的浏览器不支持 video 标签。
</video>

source：是video标签的子标签，用于指定视频的源文件，可以指定多个，浏览器会按照顺序尝试加载，直到找到一个可以播放的格式
type：指定视频的格式，用于让浏览器提前知道视频的格式，以便提前加载
其他属性：同上

音频标签¶

audio

<audio src="api/images/LL9WyWMCMIgM/song.mp3" controls autoplay muted loop></audio>

属性：

src：音频的URL
controls：是否显示控制条
autoplay：是否自动播放
muted：是否静音
loop：是否循环播放

兼容写法¶

<audio>
    <source src="api/images/FnN4JAYyfzGS/song.ogg" type="audio/ogg">
    <source src="api/images/6I7mLIbDoIxv/song.wav" type="audio/wav">
    <source src="api/images/LL9WyWMCMIgM/song.mp3" type="audio/mpeg">
    <!-- 如果都检测不到就显示 -->
    您的浏览器不支持 audio 标签。
</audio>

source：是audio标签的子标签，用于指定音频的源文件，可以指定多个，浏览器会按照顺序尝试加载，直到找到一个可以播放的格式
type：指定音频的格式，用于让浏览器提前知道音频的格式，以便提前加载