1.HTML5视频

HTML5 规定了一种通过 video 元素来包含视频的标准方法。

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>菜鸟教程(runoob.com)</title>

</head>

<body>

<video width="320" height="240" controls>

<!--src中可以是http链接-->

  <source src="movie.mp4" type="video/mp4">

  <source src="movie.ogg" type="video/ogg">

  您的浏览器不支持 HTML5 video 标签。

</video>

</body>

</html>

视频格式

视频标签中的属性

2.HTML音频

HTML5 规定了在网页上嵌入音频元素的标准，即使用 <audio> 元素。

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>菜鸟教程(runoob.com)</title>

</head>

<body>

<audio controls>

  <source src="horse.ogg" type="audio/ogg">

  <source src="horse.mp3" type="audio/mpeg">

您的浏览器不支持 audio 元素。

</audio>

</body>

</html>

音频支持的格式

音频标签中的属性

HTML5的视频和音频的更多相关文章

  1. HTML5 添加视频和音频（响应式视频）

    最初的 HTML5规范呼吁所有浏览器内置支持使用 Ogg格式① 直接播放视频或音频(无需插件).但是由于 HTML5工作组的内部争议,曾经作为基线标准的支持 Ogg(包括 Theoravideo 和 ...

  2. 借用HTML5 插入视频。音频

    HTML5 规定了一种通过 video 元素来包含视频的标准方法. 插入视频 <video width="320" height="240" contro ...

  3. 安卓与IOS移动段浏览器视频与音频的问题与总结

    1. 安卓.苹果移动浏览器上都不支持html5的视频与音频自动播放 2. 安卓.苹果移动浏览器要支持播放,前提是必须是用户触发的事件 3. 针对这个特殊的问题,代码需要在用户进来第一次屏幕触发中,去创 ...

  4. Html5视频播放器-VideoJS+Audio标签实现视频，音频及字幕同步播放

    一,VideoJS介绍 引用脚本,videojs很为你着想,直接cdn了,你都不需要下载这些代码放入自己的网站 <link href=”http://vjs.zencdn.net/c/video ...

  5. The jQuery HTML5 Audio / Video Library (jQuery jPlayer插件给你的站点增加视频和音频功能)

    http://jplayer.org/ The jQuery HTML5 Audio / Video Library jPlayer is the completely free and open s ...

  6. Html5中 视频 音频标签 进度条问题

    最近项目中使用Html5的video和audio标签来在线播放视频和音频文件,但是遇到个奇葩的问题,页面上播放之后进度条无效, 查看w3c之后发现html代码并没有什么不同,之后猜想如果用静态的htm ...

  7. html5页面怎么播放音频和视频

    html5页面怎么播放音频和视频 一.总结 一句话总结:html5 音频和视频标签:(audio And video),局限是不同浏览器对音频视频的格式支持很让人头痛 1.最基础的音频和视频标签的使用 ...

  8. HTML5（二）音频视频画布

    HTML5 Audio(音频) 定义和用法 <audio src="someaudio.wav" controls="controls"> 您的浏览 ...

  9. HTML5笔记2——HTML5音/视频标签详解

    音视频的发展史 早期:<embed>+<object>+文件 问题:不是所有浏览器都支持,而且embed不是标准. 现状:Realplay.window media.Quick ...

随机推荐

  1. storyboard连线容易出现的问题

    - 连接的方法代码被删掉,但是连线没有去掉 - 可能会出现方法找不到错误 - unrecognized selector sent to instance- 连接的属性代码被删掉,但是连线没有去掉 - ...

  2. 2014 Multi-University Training Contest 9#6

    2014 Multi-University Training Contest 9#6 Fast Matrix CalculationTime Limit: 2000/1000 MS (Java/Oth ...

  3. 配置SQL server远程连接（局域网）

    具体步骤: 1) 2) 3) 4) 5) 6) 7) 最后为了防火墙有影响,直接把防火关了,测试连接通过在来设置防火墙.

  4. HTTP参数污染

    HTTP Parameter Pollution简称HPP,所以有的人也称之为“HPP参数污染”. 一篇很不错关于HPP参数污染的文章:http://www.paigu.com/a/33478/235 ...

  5. PHP PHPUnit的简单使用

    1.window安装pear的教程:http://jingyan.baidu.com/article/ca41422fd8cf3d1eae99ed3e.html 2.在工作目录下,放两个文件: 1)C ...

  6. zend studio 做前端推荐安装的插件

    zend studio 做前端推荐安装的插件 1.Aptana插件代码提示 Zend Studio的aptana插件,解决了Zend Studio对前台代码支持不足的问题,而且在某些方面还比诸如dw优 ...

  7. Git私钥openssh格式转ppk

    已有my.openssh私钥文件,以及Key passphrase:4c264a73544ee7f3bc6ba6f8a416b6efec9d7cc6e71b745c479159cc7ee0a8cb 若 ...

  8. Android adapter适配器的学习

    学习Android有一点时间,说说自己的学习感悟. 首先呢,先说说适配器的作用,顾名思义,它就是把数据定义好一定的规则,使得我们可以用到ListView GridView等上面 所以说这玩意,还是得好 ...

  9. android 第三方登录 --- QQ

    1,jar包 2,配置AndroidManifest.xml <activity android:name=".login.LoginActivity" android:co ...

  10. 浅析HTTP协议

    HTTP协议是什么 HTPP协议是一种网际层协议,HTTP协议是无状态的,HTTP协议对用户是透明的. 每一次HTTP请求都是一次事务,一个HTTP事务是由一条请求命令和一个响应结果组成的,HTTP通 ...