<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>音频与视频</title>
</head>
<body>
<!--audio标签控制音频视频的 加了controls后浏览器里会出现音频播放器的控制器-->
<!--autoplay页面打开后自动播放 loop循坏播放 2表示循坏2次-->
<!--各个浏览器对音频的兼容问题:IE支持mp3、火狐支持oggvorbis/wav、chrome支持oggvorbis/wav、
opera支持oggvorbis/wav、safari支持mp3/wav。-->
<!--这样的写法浏览器就能自己找到相匹配的音频 页面只出现一个-->
<audio controls autoplay loop="3">
<sourse src="../see you again.mp3"></sourse>
<sourse src="../see you again.wav"></sourse>
<sourse src="../see you again.ogg"></sourse>
这句话在浏览器中会显示比如IE某款都不支持就出现了这句话让客户看到了

<video width="100" controls autoplay loop="2">
<!--在指定视频宽高是 控制条没有改变大小 所以只设置width就好了-->
<sourse src="!!!!!!.mp4"></sourse>
<sourse src="!!!!!!.ogg"></sourse>
<sourse src="!!!!!!.wenm"></sourse>
</video>
<!--IE9开始支持mp4/火狐3.5开始支持ogg、4.0开始支持webm/opera10.5开始支持ogg、10.6开始支持webm/
chrome5.0开始支持mp4和ogg、6.0开始支持webm/safari3.0开始支持mp4。-->
<!--想达到各个浏览器兼容和音频一样-->
</audio>
</body>
</html>

HTML5-Y音频与视频的更多相关文章

  1. html5之音频、视频(video&audio)

    音频&视频 本篇为本人的学习笔记. 在Html5之前,浏览器对于视频和音频的处理并没有一个标准.因此在网页中看到的视频,都是通过第三插件的方式嵌入的,如:QuickTime.RealPlaye ...

  2. css总结16:HTML5 多媒体音频(Audio)视频(video )

    1 显示嵌入网页中的 MP3 文件: <embed height="50" width="100" src="horse.mp3"&g ...

  3. [译] 用HTML5捕获音频和视频

    原文地址:http://www.html5rocks.com/en/tutorials/getusermedia/intro/ 概述 有了HTML5,我们就可以在不借助Flash或者Silverlig ...

  4. html5音频和视频标签

    在html5之前的版本中如果想要在网页中插入音频和视频必须要安装插件才可以,比如最常见的flash插件.很多人在刚安装一款浏览器的时候都会遇到浏览器建议安装flash插件,在移动端也是如此.如果想要在 ...

  5. html5 音频和视频(audio And video)

    1.音频和视频  Web 上的视频 直到现在,仍然不存在一项旨在网页上显示视频的标准. 今天,大多数视频是通过插件(比如 Flash)来显示的.然而,并非所有浏览器都拥有同样的插件. HTML5 规定 ...

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

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

  7. HTML5——拖放 地理定位 视频 音频 新的input类型

    拖放 ————>   设置元素为可拖放 拖动什么 放到何处 进行放置 实例[来回拖放] 地理定位 使用地理定位 处理错误和拒绝 在地图中显示结果 基于脚本的交互式地图 给定位置的信息 用户移动时 ...

  8. html5 audio音频播放全解析

    序 html5开启了一个新时代,因为它让浏览器本身变得不那么被动,audio api就是一个典型的列子,在html5还没确定之前,如果想要在网页上听音乐看视频唯一的办法就是用flash意思是当你没有给 ...

  9. 20款jQuery 的音频和视频插件

    分享 20 款jQuery的音频和视频插件 Blueimp Gallery: DEMO || DOWNLOAD Blueimp gallery 主要为移动设备而设计,同时也支持桌面浏览器.可定制视频和 ...

  10. H5音频和视频

    使用媒体标签最大的缺点在于缺少编解码器的支持一.浏览器支持性检测检测浏览器是否支持audio元素或video元素最简单的方式就是用脚本动态创建它,然后检测特定函数是否存在 var hasVideo=! ...

随机推荐

  1. 常用 php server

    php编程中经常需要用到一些服务器的一些资料,我把常用的用高亮的方式贴出来,其余的放在后面.方便以后查阅     复制代码代码如下: $_SERVER['HTTP_ACCEPT_LANGUAGE']/ ...

  2. “Hello World!”团队第十三次会议

    今天是我们团队“Hello World!”团队召开的第十三次会议.博客内容: 一.会议时间 二.会议地点 三.会议成员 四.会议内容 五.todo list 六.会议照片 七.燃尽图 一.会议时间 2 ...

  3. 20172330 2017-2018-1 《Java程序设计》第十周学习总结

    20172330 2017-2018-1 <程序设计与数据结构>第十周学习总结 教材学习内容总结 本周的学习内容为集合 集合 对象具有定义良好的接口,从而成为一种实现集合的完善体制. 动态 ...

  4. [二叉查找树] 1115. Counting Nodes in a BST (30)

    1115. Counting Nodes in a BST (30) 时间限制 400 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Y ...

  5. 让VS2013支持 C# 6.0 语法

    还未升级使用VS2015前,又想尝试使用C# 6.0的语言特性,可以用以下方法启用: VS2013中“工具”下选择“程序包管理器控制台”: 选中需要使用C# 6.0的项目,再敲入"Insta ...

  6. 内存测试——Android Studio中对应进程的Heap

    通过Android Studio的Heap查看该程序的目前占用内存大小,多次进出界面,观察内存内存大小的变化.用Heap监测应用进程使用内存情况的步骤如下: 1. 启动Android Studio—& ...

  7. java map添加另一个map时候 键值对的类型要一致

    java map添加另一个map时候 键值对的类型要一致

  8. cdq分治学习

    看了stdcall大佬的博客 传送门: http://www.cnblogs.com/mlystdcall/p/6219421.html 感觉cdq分治似乎很多时候都要用到归并的思想

  9. 学习Python最好的方法就是实践和教程并行,以下有一些资源和教程,还有一些学习思维导图:

    1.Python 的 14 张思维导图下载地址: https://woaielf.github.io/2017/06/13/python3-all/ 2.Python基础教程|菜鸟教程: http:/ ...

  10. 【数据库_Postgresql】sql语句添加序号,timestamp格式时间截取日期和时间

    SELECT ROW_NUMBER() OVER (ORDER BY sr.receiptid ASC) AS 序号, sr.receiptid, sr.receiptdate, DATE(sr.re ...