<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. 网上的仿QQ验证码，详细使用方法

    struts2的配置 和代码 1.生成图片流 类名:VerifyCodeUtils /** * 生成图片流 * @author Administrator * */ import java.awt.C ...

  2. 矩阵覆盖，基本DP题目

    https://www.nowcoder.net/practice/72a5a919508a4251859fb2cfb987a0e6?tpId=13&tqId=11163&tPage= ...

  3. 条款39: 避免 "向下转换" 继承层次

    基类指针不能调用派生类的独有的成员,即使基类指针指向派生类对象,因为编译器是根据指针的静态类型来确定调用对象在内存中占据的空间的.此时可以使用static_cast来转换,但不要这么做,因为向下转换难 ...

  4. LINQ体验(11)——LINQ to SQL语句之Null语义和String/DateTime方法

    在本系列中.主要介绍LINQ to SQL基础的东西,由于LINQ太强大了,它对我们寻常使用不同的数据源有着不同的内容,其包含对于SQL Server 数据库的LINQ to SQL:对于XML 文档 ...

  5. iOS-UITextView-文本输入视图的使用

    #import "ViewController.h" @interface ViewController ()<UITextViewDelegate> { UIView ...

  6. linux驱动之设备号与创建设备节点

    设备号: 1.自己主动分配 major = register_chrdev(0,"first_drv",&first_sdv_fops);//注冊 注冊设备时给设备号写0, ...

  7. html 转word

    今日头条发表文章 python-docx — python-docx 0.8.6 documentation http://python-docx.readthedocs.io/en/latest/

  8. MapReduce04

    ===================== MapReduce内部机制:本地性 ===================== 什么是数据本地性(data locality)--------------- ...

  9. Codeforces--14D--Two Paths（树的直径）

     Two Paths Time Limit: 2000MS   Memory Limit: 65536KB   64bit IO Format: %I64d & %I64u Submit ...

  10. mysql sql执行错误#1436 Thread stack overrun

    1.mysql调用存储过程  call proc1() 时报错:Thread stack overrun: 6656 bytes used of a 8496 byte stack, and 1280 ...