网页前端(12)音频视频

HTML5 音频和视频

html5增加了audio和video标签,提供了在页面上插入音频和视频的标准方法。

audio标签
支持格式:ogg、wav、mp3

对应属性:
1、autoplay 自动播放
2、controls 显示播放器
3、loop 循环播放
4、preload 预加载
5、muted 静音

举例:

      <audio src="source/audio.mp3" autoplay controls loop preload></audio>

      <!-- 或者用如下方式:  -->

      <audio  autoplay controls loop preload>
          <source src="source/audio.mp3" type="">
          <source src="source/audio02.wav" type="">
      </audio>

source标签的作用是提供多个媒体文件地址,如果一个地址的文件不兼容,就使用下一个地址。

video标签

支持格式:ogg、mp4、webM

属性:
1、width
2、height
3、Poster

可选第三方播放器:
1、cyberplayer
2、tencentPlayer
3、youkuplayer

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 今天为大家分享一下html5中的视频(video)与音频(audio)。在进入主题之前我们先了解一下Flash与h...
    秋枫惋红阅读 337评论 0 0
  • 首先,我们要理解两个概念:容器(container)和编解码器(codec)。1.视频容器音频文件或视频文件,都只...
    IT小C阅读 1,342评论 2 5
  • HTML5 第一章 HTML5概述 H5是下一代的web开发的基础. 1.1 web技术发展时间线 1991 HT...
    whitsats阅读 1,104评论 0 0
  • html5已经为我们提供了音频和视频的控制让我们不必在依赖于Flash。本次我将为大家讲解html5的音频和视频操...
    便U_Life阅读 2,685评论 1 11
  • 今天腾讯新闻客户端首页竟然推送一篇组图文章:钢厂民工日卸300吨货每吨6毛,为省钱用盐巴煮面。 说实话自从2013...
    艳云阅读 1,418评论 1 2