<audio>

1、autoplay 自动播放

2、controls 是否显不默认播放控件

3、loop 循环播放

4、preload 预加载 同时设置autoplay时些属性失效

5、由于版权等原因，不同的浏览器可支持播放的格式是不一样的

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<!--<audio src="music/yinyue.mp3" controls autoplay loop></audio>-->

<!--兼容写法-->

<audio controls loop autoplay>

    <source src="music/yinyue.mp3">

    <source src="music/yinyue.ogg">

    <source src="music/yinyue.wav">

    抱歉您的浏览器不支持

</audio>

</body>

</html>

<video>

1、autoplay 自动播放

2、controls 是否显示默认播放控件

3、loop 循环播放

4、preload 预加载，同时设置了autoplay，此属性将失效

5、width 设置播放窗口宽度

6、height 设置播放窗口的高度

7、由于版权等原因，不同的浏览器可支持播放的格式是不一样的

<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

    <style>

        body{

            text-align: center;

        }

        video{

            width: 1000px;

        }

    </style>

</head>

<body>

<!--<video src="video/movie.mp4" controls  autoplay ></video>-->

<!--  行内块 display:inline-block -->

<video controls autoplay>

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

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

    <source src="video/movie.webm"/>

    抱歉，浏览器要换了！

</video>

</body>

</html>

html5——多媒体（一）的更多相关文章

  1. Html5多媒体相关的API---video

    Html5多媒体相关的API---video 在HTML5中,新增了两个元素---video元素与audio元素,其中video元素专门用来播放网络上的视频或电影,而audio元素专门用来播放网络上的 ...

  2. HTML5 多媒体音视频处理

    HTML5 多媒体音视频处理 版权声明:未经博主授权,内容严禁转载 ! 音频处理 - audio HTML5 Audio 音频 目前大多数音频是通过哦插件的形式来播放的. 不同浏览器在网页上播放音频的 ...

  3. 三天学会HTML5 ——多媒体元素的使用

    目录 1. HTML5 Media-Video 2. HTML5 Media-Audio 3. 拖拽操作 4. 获取位置信息 5. 使用Google 地图获取位置信息 多媒体是互联网中的最重要的一部分 ...

  4. HTML5 多媒体标签

    一.多媒体 embed 标签 embed可以用来插入各种多媒体,格式可以是 Midi.Wav.AIFF.AU.MP3等等.url为音频或视频文件及其路径,可以是相对路径或绝对路径. 语法格式: < ...

  5. html5多媒体Video/Audio

    video:    1.常见的视频格式 视频的组成部分:画面.音频.编码格式 视频编码:H.264.theora.VP8(google开源)      2.常见的音频格式     编码:AAC.MP3 ...

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

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

  7. html5——多媒体（四）

    全屏兼容 box.requestFullscreen(); box.webkitRequestFullScreen(); box.mozRequestFullScreen(); <!DOCTYP ...

  8. html5——多媒体（三）

    自定义进度条 1.video标签是内联块,可以设置宽高,但是需要用大盒子将其包裹起来进行定位 2.小盒子设计成进度条样式,并进行定位 3.进度条样式中的特殊按钮可以用web字体 4.通过点击实现视频的 ...

  9. html5——多媒体（二）

    基本方法 load() //重新加载视频 play() //播放 pause() //暂停 基本属性 currentTime //视频播放的当前进度. duration //视频的总时间 paused ...

随机推荐

  1. hdu 2602 简单0-1背包模板题

    #include<stdio.h> #include<string.h> #define N 1100 int dp[N]; int main() { int n,t,m,a[ ...

  2. 超级钢琴（codevs 2934）

    题目描述 Description 小Z是一个小有名气的钢琴家,最近C博士送给了小Z一架超级钢琴,小Z希望能够用这架钢琴创作出世界上最美妙的音乐. 这架超级钢琴可以弹奏出n个音符,编号为1至n.第i个音 ...

  3. 转载 字符串hash

    转载自:http://www.cnblogs.com/jiu0821/p/4554352.html 求一个字符串的hash值: •现在我们希望找到一个hash函数,使得每一个字符串都能够映射到一个整数 ...

  4. [转] python 获取本机ip地址的两种实现方法

    #!/usr/bin/python import socket import fcntl import struct def get_ip_address(ifname): s = socket.so ...

  5. 用xtrabackup+binlog恢复误删除的数据库

    关键技术,数据库产生的二进制文件,在主库就是binlog在从库就是relay-log,用最新的物理备份可以新启动个新实例,可以模拟个从库,把主库的binlog复制到新的数据库实例上,利用主从复制和物理 ...

  6. Vim tips——Working with external commands

    A common sequence of events when editing files is to make a change and then need to test by executin ...

  7. go语言slice的理解

    Golang slice yongsean  作者 2017.02.17 00:07  打开App 创建切片,len.cap.append b := make([]int, 5) println(le ...

  8. Flex 绘制圆形并填充图片

    注意:Ellipse 绘制椭圆,当width = height 时 则绘制圆形. BitmapFill:填充图片 <s:Group id="gpimgUser" width= ...

  9. 一个样例看清楚JQuery子元素选择器children()和find()的差别

    近期在我们的hybrid app项目开发中定位出了一个问题.通过这个问题了解下JQuery选择器find()和children()的差别.问题是这种:我们的混合app是一个单页面应用(main.htm ...

  10. requireJS defined undefined

    requeireJS 在使用时,在 defined 注入一个依赖,路径正确,却发现获得的值却是 undefined .这时候就要考虑是否是“循环依赖”的原因了. 循环依赖就是: a.js 依赖了 b. ...