video,source元素
一,视频
<video src="../[再一次快乐结局]第15集.mp4" controls="controls" width="500" height="300" poster="../1.jpg" loop="loop" autoplay="autoplay" preload="auto"> 您的浏览器暂不支持! </video>
注意:此标签不在input标签内
control:显示视频的播放,音量,暂停等工具栏
width,height:视频的长宽
poster:播放前的预览图
loop:当图片结束时,重新播放
autoplay:加载结束自动播放
preload: 1.auto:自动加载视频的播放时间,播放内容
2.none:默认值
3.metadata:自动加载视频的时间,但不加载播放的内容
<video width="500" controls="controls" > 您的浏览器暂不支持!
  <source src="../[再一次快乐结局]第15集.mp4"  type="video/mp4" />
  <source src="../[再一次快乐结局]第15集.webm" type="video/webs" />
  <source src="../[再一次快乐结局]第15集.ogg"  type="video/ogg"  />
</video>
您的浏览器暂不支持此格式! 
</video>
source:解决浏览器的兼容性问题,但此时video标签内不能使用src
以上三种视频格式,浏览器会根据格式选择播放,哪种格式合适就哪种,若格式都不满足,将会显示source标签中的内容;
二,音频
<audio controls="controls" > 您的浏览器暂不支持!
  <source src="../爱你.mp3"  type="audio/mp4" />
  <source src="../爱你.webm" type="audio/webs" />
  <source src="../爱你.ogg"  type="audio/ogg"  />
</audio>
与video相比,减少的属性:width poster
video,source元素的更多相关文章
- html5--4-3 source元素-解决浏览器的兼容
		
html5--4-3 source元素-解决浏览器的兼容 学习要点 掌握source元素的用法 source元素-解决浏览器额兼容 HTML5 中新增的元素 video和audio元素的子元素,可指定 ...
 - html5的source元素
		
html5的source元素 一.总结 一句话总结: 主要是解决视频播放时候的浏览器的兼容问题 二.html5的source元素 学习要点 掌握source元素的用法 source元素-解决浏览器额兼 ...
 - HTML5之多媒体
		
概览 html5新增了两个关于多媒体的元素:video和audio,前者是用于视频,后者用于音频.而他们使用非常简单 <audio src="xhn.mp3" control ...
 - 02_HTML5+CSS详解第三天
		
WebStorage简单的网页留言板用到的函数有3个1.saveStorage函数使用"new Date().getTime()"语句来获取当前的日期和时间戳,然后使用localS ...
 - audio和video元素
		
目录 [1]HTML元素 audio video source track[2]API 方法 属性 事件 audio专有 前面的话 HTML5新增了两个与媒体相关的标签,让开发人员不必依赖任何插件就能 ...
 - javascript 创建video元素
		
<!DOCTYPE html> <html> <body> <h3>演示如何创建 VIDEO 元素</h3> <p>请点击按钮来 ...
 - video元素和audio元素
		
内容: 1.video元素 2.audio元素 注:这两个元素均是HTML5新增的元素 1.video元素 (1)用途 <video> 标签定义视频,比如电影片段或其他视频流 (2)标签属 ...
 - html5的video元素学习手札
		
为了监控移动端视频播放的情况,研究了一下 html5 <video> 标签的属性与事件触发,及其在各系统和各个浏览器的兼容情况 属性与事件 理解清楚属性和事件,才能更好的使用 video ...
 - 《HTML5》 Audio/Video全解
		
一.标签解读 <audio> 标签属性 <audio id="media" src="http://www.abc.com/test.mp3" ...
 
随机推荐
- 数字集成电路设计-8-一个简单sobel图像边缘检测加速器的设计,实现,仿真与综合
			
引言 图像视频处理等多媒体领域是FPGA应用的最主要的方面之一,边缘检测是图像处理和计算机视觉中的基本问题,所以也是最常用的,随着数据量的不断增加以及对实时性的要求,一般软件已经不能满足实际需要,这时 ...
 - PAT 1017. Queueing at Bank
			
Suppose a bank has K windows open for service. There is a yellow line in front of the windows which ...
 - DTRACE 专家
			
http://dtrace.org/blogs/bmc/ https://github.com/bcantrill http://www.tudou.com/programs/view/Q6fHZFg ...
 - GitHub与Versions
			
[第一步]建立先仓库 第一步的话看一般的提示就知道了,在github新建一个repository(谷歌可以解决),都是可视化的界面操作,所以难度不大.或者看这里:https://help.github ...
 - [转] React Router 使用教程
			
PS:react-route就是一个决定生成什么父子关系的组件,一般和layout结合起来,保证layout不行,内部的子html进行跳转 你会发现,它不是一个库,也不是一个框架,而是一个庞大的体系. ...
 - android开发之gridlayout使用入门
			
这个东东以前没怎么用过,今天研究了一下,不难,感觉只是在某些方面很好用. 记录下,做个计算器. <GridLayout xmlns:android="http://schemas.an ...
 - Android 自定义View修炼-自定义HorizontalScrollView视图实现仿ViewPager效果
			
开发过程中,需要达到 HorizontalScrollView和ViewPager的效果,于是直接重写了HorizontalScrollView来达到实现ViewPager的效果. 实际效果图如下: ...
 - iOS UIKit:Navigation Controllers
			
navigation controller是一种层次结构的container view controller,即其通过一个view controllers栈来管理内部的content view con ...
 - 各种vpn协议介绍(重点介绍sslvpn的实现方式openvpn)
			
vpn介绍: VIrtual Private Network 虚拟专用网络哪些用户会用vpn? 公司的远程用户(出差.家里),公司的分支机构.idc机房.企业间.FQ常见vpn协议有哪些? ...
 - SqlServer循环读取配置
			
USE [DB_JP_BaseInfo00] GO /****** Object: StoredProcedure [dbo].[sp_wx_getAppointmentInfo_Str] Scrip ...