1 显示嵌入网页中的 MP3 文件:

<embed height="50" width="100" src="horse.mp3">

 2 HTML5 <audio> 音频播放属性:

2-1 audio  常用属性:

autoplay 自动播放   loop 循环 controls 控制器

例子:

<audio controls>
  <source src="horse.mp3" type="audio/mpeg">
  <source src="horse.ogg" type="audio/ogg">
  Your browser does not support this audio format.
</audio>

3-1  常用属性:

autoplay 自动播放   loop 循环 controls 控制器

3-1 代码:

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  <source src="movie.webm" type="video/webm">
您的浏览器不支持 video 标签。
</video>

注:source  指的是播放资源.若前两个无法播放,自动播放后两个.

css总结16:HTML5 多媒体音频(Audio)视频(video )的更多相关文章

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

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

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

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

  3. html5中的audio和video属性和事件汇总

    <audio> 标签属性: src:音乐的URL preload:预加载 autoplay:自动播放 loop:循环播放 controls:浏览器自带的控制 <video> 标 ...

  4. HTML5无插件多媒体Media——音频audio与视频video

    文件日志地址  http://blog.csdn.net/q1056843325/article/details/60336226 音频与视频现在已经变得越来越流行 各个网站为了保证跨浏览器的兼容性 ...

  5. 【HTML5】音频视频

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  6. audio和video元素

    目录 [1]HTML元素 audio video source track[2]API 方法 属性 事件 audio专有 前面的话 HTML5新增了两个与媒体相关的标签,让开发人员不必依赖任何插件就能 ...

  7. HTML5视频Video 音频Audio

    视频协议 视频格式 Flash HTML5 HTTP flv HTTP f4v HTTP mp4 HTTP m3u8 HTTP webm HTTP ogg RTMP flv RTMP f4v RTMP ...

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

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

  9. HTML5 Video与Audio 视频与音频

    ---- 视频Video对象 - 指定视频播放地址 <video width="320" height="240" controls="cont ...

随机推荐

  1. PCB 锣板和半孔工艺的差别

    PCB 锣板和半孔工艺的差别 PCB 在做模块时会用到半孔工艺,但是由于半孔是特殊工艺. 需要加费用,打板时费还不低. 下面这个图是锣板和半孔工艺的差别. https://www.amobbs.com ...

  2. FastAdmin Bootstrap-Table 分页列表 pageList 如何设置?

    FastAdmin Bootstrap-Table 分页列表 pageList 如何设置? FastAdmin 的 表格使用的是 Bootstrap-Table 组件,这个组件该有的功能他都有. 默认 ...

  3. Tomcat设置欢迎页问题

    今天下载了tomat9,配置到eclipse后拉起来,想跑个欢迎页看看是否起好了,随手写了个index.jsp放到项目Struts2的WebContent根目录下,直接打开网页输入http://loc ...

  4. 新机器连接老机器遇到的ERROR

    Ansible无法连接老旧机器 报错内容: [root@BI ansible]# ansible -i /etc/ansible/hosts GameServer -m ping 10.10.113. ...

  5. memcache常见问题及解答

    memcached的cache机制是怎样的? Memcached主要的cache机制是LRU(最近最少用)算法+超时失效.当您存数据到memcached中,可以指定该数据在缓存中可以呆多久Which ...

  6. Git 学习小问题记录

    最近一直使用Git在管理代码,但是的确不规范,今天开始恶补Git常用命令.实际今天的任务是需要从master牵出一条branch.心想着这个简单只补一下创建分支以及merge的这边的命令就可以了,于是 ...

  7. ansible安装配置zabbix客户端

     安装软件 ansible host -m apt -a "name=zabbix-agent state=present" ansible host -m shell -a ...

  8. 主表当中明细表字段的金额计算问题,操作控件是在gridview+aspnetPage

    做这个例子,主要是我在工作当中遇到一个主表的明细表的操作计算问题,也用了不少时间.操作计算的方式是这样的. 这个功能是在.net语言当中实现,操作过程当点击添加行,添加第一行时,当我输入金额的时候,累 ...

  9. new Com

    CreateOleObject System.Win.ComObj.hpp #include <objbase.h>     Winapi.ActiveX.pas   CoInitiali ...

  10. Python基础学习三 list-增删改查、切片、循环、排序

    一.list 增删改查 1.增加 方式一: stus = ['xiaohei','xiaobai','xiaohuang','cxdser'] stus.append('test001')#从最后面开 ...