HTML5 新特性 - audio、video 音频与视频标签

音频与视频

        `HTML5`提供了音频与视频相关的新标准(标签)可以使浏览器支持音视频播放.

 音频标签

        浏览器支持的音频格式:  `mp3`   `wav`   `ogg` .

        简写方式:

<audio src="音频文件路径" controls></audio>

        标准方式:

<audio controls>
    <source src="letitgo.mp3" type="audio/mpeg" />
    <source src="letitgo.wav" type="audio/wav" />
    <source src="letitgo.ogg" type="audio/ogg" />
    什么破浏览器, 建议你换一个..
</audio>

        音频标签常用属性:

<audio src=""          	音频资源路径
       controls			控制面板
       autoplay			是否开启自动播放
       muted			是否静音
       loop				是否单曲循环
       preload=""		音频资源的预加载模式
       >
</audio>

        preload属性用于设置音频的加载方式:

  1. none 不进行任何音频的预加载

  2. metadata 只加载元数据

  3. auto 尽可能的加载音频资源

视频标签

  video标签用于播放视频, 支持的视频格式有: mp4, webm, ogg,

        简写方式:

<video src="./letitgo.mp4" controls></video>

        视频标签常用属性:

<video src=""          	音频资源路径
       controls			控制面板
       autoplay			是否开启自动播放
       muted			是否静音
       loop				是否单曲循环
       preload=""		音频资源的预加载模式
       width=""			播放器的宽度
       height=""		播放器的高度
       poster="1.jpg"	播放器的海报帧  封面
       >
</video>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值