video标签:播放视频

     格式一:<video src="">

        </video>

  video标签的属性:

    src:用于告诉video标签需要播放的视频地址。

    autoplay:用于告诉video标签是否需要自动播放视频。

    controls:用于告诉video标签是否需要显示控制条。

    poster:用于告诉video标签视频没有播放之前显示的占位图片。

    loop:一般用于做广告视频,用于告诉video标签视频播放完毕之后是否需要循环播放。

    preload:预加载视频,但是需要注意,preload和autoplay相冲,如果设置了autoplay属性,那么preload属性就会失效。

    muted:静音。

    width:宽度。

    height:高度。(width和height只需要设置一个就可以了。)

    格式二:<video>

           <source src=" " type=" "></source>

         </video>

        eg:<video autoplay="autoplay" controls="controls">

            <source src="data:images/sb1.webm" type="video/webm"></source>

            <source src="data:images/sb1.mp4" type="video/mp4"></source>

            <source src="data:images/sb1.ogg" type="video/ogg"></source>

          </video>

audio属性:播放音频。

     格式一:<audio src=" ">

         </audio>

     格式二:<audio>

            <source src=" " type=" ">

         </audio>

     audio标签和video标签的使用基本一样

     audio标签的属性,除了height / width / poster属性以外,其余的属性参考video标签的属性。

初学HTML-8的更多相关文章

  1. DDD初学指南

    去年就打算总结一下,结果新换的工作特别忙,就迟迟没有认真动手.主要内容是很多初学DDD甚至于学习很长时间的同学没有弄明白DDD是什么,适合什么情况.这世界上没有银弹,抛开了适合的场景孤立的去研究DDD ...

  2. gulp初学

    原文地址:gulp初学 至于gulp与grunt的区别,用过的人都略知一二,总的来说就是2点: 1.gulp的gulpfile.js  配置简单而且更容易阅读和维护.之所以如此,是因为它们的工作方式不 ...

  3. 初学seaJs模块化开发,利用grunt打包,减少http请求

    原文地址:初学seaJs模块化开发,利用grunt打包,减少http请求 未压缩合并的演示地址:demo2 学习seaJs的模块化开发,适合对seajs基础有所了解的同学看,目录结构 js — —di ...

  4. 初学Vue2.0--基础篇

    概述: 鉴于本人初学,使用的编译器是webStorm,需添加对VUE的支持,添加方法可以参考 http://www.jianshu.com/p/142dae4f8b51. 起步: 1. 扎实的 Jav ...

  5. 初学Python

    初学Python 1.Python初识 life is short you need python--龟叔名言 Python是一种简洁优美语法接近自然语言的一种全栈开发语言,由"龟叔&quo ...

  6. Javascript初学篇章_5(对象)

    对象 Javascript是一种面向对象的语言,因此可以使用面向对象的思想来进行javascript程序设计对象就是由一些彼此相关的属性和方法集合在一起而构成的一个数据实体.举个例子,一只猫是个对象, ...

  7. 初学Objective-C语言需要了解的星星点点

             其实大多数开发初学者都有一些相同的特点,可以说是一种“职业病”.Most有其他平台开发基础的初学者,看到Xcode就想摩拳擦掌:看到Interface Builder就想跃跃欲试:而 ...

  8. matlab初学之句柄

    文章出处:http://www.cnblogs.com/CBDoctor/archive/2012/04/06/2434072.html 在matlab中,每一个对象都有一个数字来标识,叫做句柄.当每 ...

  9. 初学HTML5、初入前端

    学习HTML5是一个漫长的过程,当中会遇到很多技术与心态上的变化.刚开始学习,我们不能发力过猛,需要一个相对稳定的状态去面对.多关注一些自己感兴趣的网站和技术知识,建立自己的信心与好奇心,为以后的学习 ...

  10. Python初学的易犯错误

    当初学 Python 时,想要弄懂 Python 的错误信息的含义可能有点复杂.这里列出了常见的的一些让你程序 crash 的运行时错误. 1)忘记在 if , elif , else , for , ...

随机推荐

  1. samba服务配置(二)

    需求: 某公司销售部门提出一个文件共享需求,要求部门共享目录有三个,第一个共享目录所有销售部门人员都具有可读可写权限: 第二个共享目录所有销售人员只读权限,经理级别的销售人员具有可读可写权限:第三个共 ...

  2. Mybatis中输入输出映射和动态Sql

    一.输入映射 我们通过配置parameterType的值来指定输入参数的类型,这些类型可以是简单数据类型.POJO.HashMap等数据类型 1.简单类型 2.POJO包装类型 ①这是单表查询的时候传 ...

  3. 电子技术经典资料汇总:PCB设计篇

    电子技术经典资料汇总:PCB设计篇,下面的链接是一个一个的文件下载的,也是压缩包的内容,只不过我把他们给汇总成了一个压缩包,方便大家下载,还有更多电子技术必备基础资料,通信无线类的,C语言篇的,关于电 ...

  4. hadoop安装hive及java调用hive

     1.安装hive 在安装hive前,请确保已经安装好了hadoop,如未安装,请参考centoos 安装hadoop集群进行安装: 1.1.下载,解压 下载hive2.1.1:http://mirr ...

  5. 走你!Github 开源整合

    加入知识星球,最好的分享交流平台哦~ <我的知识星球,最好的分享交流平台>,一年的服务平台,对于一个成年人来说,就是小费了(更多详情,请点击文章了解)~ 走你!Github 开源整合 1. ...

  6. 深入理解css3中 nth-child 和 nth-of-type 的区别

    在css3中有两个新的选择器可以选择父元素下对应的子元素,一个是:nth-child 另一个是:nth-of-type. 但是它们到底有什么区别呢? 其实区别很简单::nth-of-type为什么要叫 ...

  7. Ubantu 16.04升级内核版本和还原到升级之前的内核版本的方法

    一.查看系统信息 1.查看发布版本: 命令: lsb_release -a 运行结果: / 2.查看内核版本: 命令: uname -sr 运行结果: 二.升级内核的方法 1.内核下载地址:http: ...

  8. Javascript:alert(1)可以这样写以绕过filter

    在2011年的BlackHat DC 2011大会上Ryan Barnett给出了一段关于XSS的示例javascript代码: ($=[$=[]][(__=!$+$)[_=-~-~-~$]+({}+ ...

  9. 在mpvue中使用map如何避坑

    最近在做一个需求,当用户放大地图到某个级别时,自动显示marker的callout标签,当小于这个缩放级别时,则隐藏callout.然而在我实现的过程中,却发现一个严重的问题:当我操作marker数据 ...

  10. oracle使用connect by进行级联查询 树型菜单

    Oracle使用connect by进行级联查询 树型菜单(转) connect by可以用于级联查询,常用于对具有树状结构的记录查询某一节点的所有子孙节点或所有祖辈节点. 来看一个示例,现假设我们拥 ...