美文网首页
HTML5新增的多媒体标签

HTML5新增的多媒体标签

作者: 八月飞花 | 来源:发表于2020-04-21 18:57 被阅读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>

相关文章

  • CSS3新增1

    一、HTML5 新增标签 新增语义化标签 使用语义化标签的注意 二、多媒体音频标签 多媒体标签有两个,分别是 音频...

  • 初识HTML5

    html5 ≈ html5新增标签以及规范 html5 ≈ html5新增标签 + css3 + JavaScri...

  • HTML5新增的多媒体标签

    这两个标签分别是 video 和 audio audio音频标签 video视频标签 由于受到不同浏览器支持视频文...

  • html5新增的元素以及DOM拓展

    HTML5 简介 html的第五个版本 新增特性 api 多媒体 语义化 过渡 动画 废弃 一些标签 支...

  • HTML5新增标签

    HTML5新增标签

  • HTML HTML5新增标签属性整理

    HTML5 新增属性详解 HTML5 新增标签详解 HTML5 新增全局属性详解

    h5+css黑马笔记

    HTML5 新增标签 新增了那些语义化标签header --- 头部标签nav --- 导航...

  • HTML5 新增标签

    HTML5新增标签 HTML5新增了27个标签元素,废除了16个标签元素,主要包括结构性标签、级块性标签、行内语义...

  • 小羊教程——HTML5多媒体标签

    本节主要内容是HTML5的多媒体标签audio和video 直接步入正题,HTML5的多媒体标签主要有两个vide...

  • HTML5详解

    01-HTML5新增语义化标签 HTML5语义化标签的兼容 HTML5新增表单控件和表单属性 HTML5表单验证反...

网友评论

      本文标题:HTML5新增的多媒体标签

      本文链接:https://www.haomeiwen.com/subject/ekupihtx.html