HTML5新增的多媒体标签

2020-04-21  本文已影响0人  八月飞花

这两个标签分别是 video 和 audio

audio音频标签

属性
  src:播放路径
  controls:显示控制面板
  auto:自动播放:但是页面需要添加交互才能实现自动播放
  loop:循环

video视频标签

属性
  src:播放路径
  controls:显示控制面板
  auto:自动播放:但是页面需要添加交互才能实现自动播放
  loop:循环
  width:宽度
  height:高度
设置宽高的时候,默认设置的宽度或高度中的一个生效,另一个虽然也生效,但是
  不会影响视频的画面,视频始终等比例
  poster:当视频还没有完全下载或者用户还没点击播放前的默认显示封面,默认
          显示当前视频文件的第一幅画面,可以是图片路径

<video poster="路径"></video>

由于受到不同浏览器支持视频文件不一样,需要考虑浏览器是否支持

我们可以准备多个视频文件,让浏览器进行选择

视频

设置多个格式的视频,会逐一匹配,直到匹配到可以解析的文件
<video>
 <source src="视频路径" type="video/编码格式1">
 <source src="视频路径" type="video/编码格式2">
 <source src="视频路径" type="video/编码格式3">
</video>
上一篇下一篇

猜你喜欢

热点阅读