HTML5新增特性和标签

一.新增视频标签

除了MP4格式之外,还有很多其他的视频文件格式,每种格式都有其特点和适用场景。以下是一些

常见的视频文件格式:

 每种格式都有其优点和缺点,例如兼容性、压缩效率、编辑便利性和播放质量

正常开发情况下,MP4支持主流浏览器,无需考虑兼容性问题

<HTML>video标签:

  1. 书写格式:*<video src="文件地址" controls="controls"></video>
  2. 相关属性
  • src: 视频文件的 URL 地址。
  • controls: 如果存在此属性,则会在视频下方显示控制条,包括播放/暂停按钮、进度条等。
  • autoplay: 如果存在此属性,则视频将在页面加载后自动播放。
  • loop: 如果存在此属性,则视频播放完毕后会重新开始播放。
  • muted: 如果存在此属性,则视频默认静音。
  • preload: 指定视频是否应该在页面加载时预加载数据。可以是 auto(自动预加载)、metadata(只加载元数据)或 none(不预加载)。
  • poster: 指定在视频尚未播放之前显示的图像 URL。
  • width: 视频播放器的宽度。
  • height: 视频播放器的高度。
  • autoplay: 如果存在此属性,则视频将在页面加载时自动播放。
  • playsinline: 如果存在此属性,则视频在移动端设备上不会进入全屏模式播放。
  • disablePictureInPicture: 如果存在此属性,则禁止画中画模式。
  • disableRemotePlayback: 如果存在此属性,则禁止远程播放(如 Chromecast)

 ***谷歌浏览器禁用了autoplay自动播放功能***

二.新增音频标签

 HTML5可以在不适用插件的条件下,原生的支持音频格式文件的播放,但是支持的格式有限。

<HTML>audio标签:

***所有浏览器都支持MP3格式***
  1. 书写格式:<audio src="文件地址" controls="controls"></audio>
  2. 相关属性:
  • controls:显示控件
  • autoplay:(谷歌禁用)
  • loop=loop 设置循环播放

三.多媒体标签总结

  1. 音频标签和视频标签的使用方式基本一致
  2. 我们可以给视频标签添加muted属性来静音播放视频,音频只能通过JavaScript解决
  3. 浏览器兼容性支持情况不同,除此之外,谷歌浏览器取消了音频和视频的自动播放(有大内存的视频可以节省大家的流量)

———————————————————————————————————————————

本文到这里就结束了 

你的【点赞,好评,收藏】是我创作的动力。感谢大家支持

  • 6
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值