HTML5的视频和音频
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的视频和音频的更多相关文章
- HTML5 添加视频和音频(响应式视频)
最初的 HTML5规范呼吁所有浏览器内置支持使用 Ogg格式① 直接播放视频或音频(无需插件).但是由于 HTML5工作组的内部争议,曾经作为基线标准的支持 Ogg(包括 Theoravideo 和 ...
- 借用HTML5 插入视频。音频
HTML5 规定了一种通过 video 元素来包含视频的标准方法. 插入视频 <video width="320" height="240" contro ...
- 安卓与IOS移动段浏览器视频与音频的问题与总结
1. 安卓.苹果移动浏览器上都不支持html5的视频与音频自动播放 2. 安卓.苹果移动浏览器要支持播放,前提是必须是用户触发的事件 3. 针对这个特殊的问题,代码需要在用户进来第一次屏幕触发中,去创 ...
- Html5视频播放器-VideoJS+Audio标签实现视频,音频及字幕同步播放
一,VideoJS介绍 引用脚本,videojs很为你着想,直接cdn了,你都不需要下载这些代码放入自己的网站 <link href=”http://vjs.zencdn.net/c/video ...
- 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 ...
- Html5中 视频 音频标签 进度条问题
最近项目中使用Html5的video和audio标签来在线播放视频和音频文件,但是遇到个奇葩的问题,页面上播放之后进度条无效, 查看w3c之后发现html代码并没有什么不同,之后猜想如果用静态的htm ...
- html5页面怎么播放音频和视频
html5页面怎么播放音频和视频 一.总结 一句话总结:html5 音频和视频标签:(audio And video),局限是不同浏览器对音频视频的格式支持很让人头痛 1.最基础的音频和视频标签的使用 ...
- HTML5(二)音频视频画布
HTML5 Audio(音频) 定义和用法 <audio src="someaudio.wav" controls="controls"> 您的浏览 ...
- HTML5笔记2——HTML5音/视频标签详解
音视频的发展史 早期:<embed>+<object>+文件 问题:不是所有浏览器都支持,而且embed不是标准. 现状:Realplay.window media.Quick ...
随机推荐
- NoClassDefFoundError vs ClassNotFoundException
我们先来认识一下Error 和Exception, 两个都是Throwable类的直接子类. Javadoc 很好的说明了Error类: An Error is a subclass of Thro ...
- (PPT)Linux服务器基础
- synchronized在jvm底层是如何实现的
目前在Java中存在两种锁机制:synchronized和Lock,Lock接口及其实现类是JDK5增加的内容,其作者是大名鼎鼎的并发专家Doug Lea.本文并不比较synchronized与Loc ...
- 03OC的类的补充
上一章我们介绍了类的定义,以及类的里面如何定义成员变量,如何定义方法等等. 一.self关键字 1.在C#中有关键字this表示当前对象,其实在OC中也有类似的关键字self,只是self关键字不仅表 ...
- linux下编译安装vim7.4并安装clang_complete插件
linux下编译安装vim7.4并安装clang_complete插件 因为debian里软件仓库中下载安装的vim是不支持python写的插件的(可以打开vim,在命令模式先输入:py测试一下),导 ...
- js自动更新时间+星期
<div class="top_bar" id="cao" height="28px"><script> setIn ...
- "转" CXF+JAXB处理复杂数据
CXF简单数据类型以及类(JavaBean)都提供了较好的支持. 但是对于一些复杂类型(集合或者Map的嵌套)的处理时,就需要我们进行“”人工干预“.在网上找了一些文章,其中这篇写的最为详细,再次备注 ...
- Ubuntu 12.04安装Adobe Reader
原本从Adobe 官方网站下载了 Adobe Reader, 是个rpm包,先用agt-get 装了rpm(sudo apt-get install rpm), 一安装(rpm -ivh AdobeR ...
- 6.openstack之mitaka搭建网络节点
部署网络服务 一:控制节点配置 1.建库建用户 mysql -u root -p CREATE DATABASE neutron; GRANT ALL PRIVILEGES ON neutron.* ...
- iOS 8.0后使用UIAlertController
iOS 8的新特性之一就是让接口更有适应性.更灵活,因此许多视图控制器的实现方式发生了巨大的变化.全新的UIPresentationController在实现视图控制器间的过渡动画效果和自适应设备尺寸 ...