[学习笔记]今天开始学HTML5!
1,href和src的区别:href有“连接,引用”之意,指两者的连接关系,如<a href=""></a>,<link href="**.css"/>;
src有“获取”之意,指拿来使用,如<img src="./**.jpg"/>。
2,HTML5标签
1>,<video>,视频标签,仅支持ogg,mpeg4,webm格式视频
<video scr="' width="" height="" controls="controls"></video>支持宽,高,开始暂停音量控件;
<video>
<source src="**.ogg" type="video/ogg">
<source src="**.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>如有多个视频来源,source标签引用多个视频来源,浏览器选择支持的格式,当浏览器不支持video标签是,显示内部文本。
video支持DOM控制,提供play(),pause()方法,提供属性paused
<!DOCTYPE html>
<html>
<body> <div style="text-align:center;">
<button onclick="playPause()">播放/暂停</button>
<button onclick="makeBig()">大</button>
<button onclick="makeNormal()">中</button>
<button onclick="makeSmall()">小</button>
<br />
<video id="video1" width="420" style="margin-top:15px;">
<source src="/example/html5/mov_bbb.mp4" type="video/mp4" />
<source src="/example/html5/mov_bbb.ogg" type="video/ogg" />
Your browser does not support HTML5 video.
</video>
</div> <script type="text/javascript">
var myVideo=document.getElementById("video1"); function playPause()
{
if (myVideo.paused)
myVideo.play();
else
myVideo.pause();
} function makeBig()
{
myVideo.width=560;
} function makeSmall()
{
myVideo.width=320;
} function makeNormal()
{
myVideo.width=420;
}
</script> </body>
</html>
2>,<audio>音频标签,用法类比<video>
3>,html5好难啊。。。
[学习笔记]今天开始学HTML5!的更多相关文章
- (6)《Head First HTML与CSS》学习笔记---结尾、《HTML5权威指南》读书笔记
1.内联元素的外边距.内边距与块元素稍有不同. 如果一个内联元素四周都增加外边距,只能看到左边和右边会增加空间:你也可以对内联元素的上下增加内边距,不过这个内边距不会影响包围它的其他内联元素的间距—— ...
- HTML5 学习笔记(一)——HTML5概要与新增标签
目录 一.HTML5概要 1.1.为什么需要HTML5 1.2.什么是HTML5 1.3.HTML5现状及浏览器支持 1.4.HTML5特性 1.5.HTML5优点与缺点 1.5.1.优点 1.5.2 ...
- 【学习笔记】--- 老男孩学Python,day2
今天正式上课的第一天,好害怕.好紧张.好激动.好兴奋! 第一天的课程还算是比较简单吧,因为之前断断续续学的就是这点东西,算是这些都比较熟了吧 今天学习了如下课程: 1. 简单计算机组成 2. pyth ...
- HTML5 学习笔记(二)——HTML5新增属性与表单元素
目录 一.HTML5新增属性 1.1.contextmenu 1.2.contentEditable 1.3.hidden 1.4.draggable 1.5.data-* 1.6.placehold ...
- Javascript高级编程学习笔记(48)—— HTML5
HTML变动最大的版本应该就是HTML5了,这里就介绍一些 HTML5新增的DOM相关的API 与类相关的扩充 HTML4在普及后有一个十分重要的变化,即class属性使用的场景越来越多 所以HTML ...
- 【学习笔记】---老男孩学Python,day1
老早同学就推荐自己学编程了,因为各种事耽误了几年的时间,也可以说自己没有居安思危的意识吧… 直到今年2月份决定掏钱学线上课,但是又被兼职打断了,公司忙,兼职事多,拖来拖去只能把课程延期.这一拖就到了五 ...
- 【学习笔记】--- 老男孩学Python,day15 python内置函数大全,递归,二分法
1. lamda匿匿名函数2. sorted()3. filter()4. map()5. 递归函数 一. lamda 匿名函数 为了了解决一些简单的需求⽽设计的⼀句话函数 语法: 函数名 = lam ...
- 【学习笔记】--- 老男孩学Python,day6 字典
详细方法:http://www.runoob.com/python/python-dictionary.html 1. dict 用大括号{} 括起来. 内部使用key:value的形式来保存数据 { ...
- 【学习笔记】--- 老男孩学Python,day5 列表 元祖
今日主要内容1. list(增删改查) 列表可以装大量的数据. 不限制数据类型. 表示方式:[] 方括号中的每一项用逗号隔开 列表和字符串一样.也有索引和切片 常用的功能: 1. 增: append( ...
随机推荐
- 接收时物料必须为Active状态
应用 Oracle Inventory 层 Level Function 函数名 Funcgtion Name RCV_RCVRCERC 表单名 Form Name RCVRCERC 说明 Descr ...
- 使用MySQL处理百万级以上数据时,不得不知道的几个常识
最近一段时间参与的项目要操作百万级数据量的数据,普通SQL查询效率呈直线下降,而且如果where中的查询条件较多时,其查询速度简直无法容忍.之前数据量小的时候,查询语句的好坏不会对执行时间有什么明显的 ...
- Siverlight+WCF+Nhibernate 开发之旅(一)
最近正在开发sl程序,考虑了很久,参考了一些框架,令人头疼的数据访问层最终选择wcf+nhibernate,至于为什么选择wcf和nh,个人参考了其他的框架感觉这两者结合从开发效率和便捷性方面比其他的 ...
- VM 映像 PowerShell 教学系列博客文章
编辑人员注释:本文章是与Microsoft Azure工程的项目经理Kay Singh共同撰写的 正如我在第一篇博客文章中所承诺的,我又回来了,为大家分步介绍如何在PowerShell中使用VM ...
- mysql 语句练习
一. 设有一数据库,包括四个表:学生表(Student).课程表(Course).成绩表(Score)以及教师信息表(Teacher).四个表的结构分别如表1-1的表(一)~表( ...
- 茴香豆的第五种写法---设置ExpandableListView系统自带图标按下效果
1 编写groupindicator_selector.xml如下: <?xml version="1.0" encoding="utf-8"?> ...
- 不定高度实现垂直居中(兼容低版本ie)
css实现垂直居中的方法比较多,但是每种方法的缺陷也很明显,我尝试对其中一种方法进行了改良 先看原方法: <div class="parent"> <div cl ...
- 关于在App_Code文件夹自定义类中Session无法使用
由于前台页面需要调用App_Code中自定义类的函数,但在自定义类中找不到Session,解决方法如下: 新建一个类session,并自己定义函数GetSession(),引用命名空间 System. ...
- SqLite 使用 Dapper 查询INTEGER类型的主键问题
在程序实体定义时: public int TableID { get; set; } 使用Dapper查询SqLite数据库时会报错 Error parsing column (= - Int64) ...
- js 模拟java 中 的map
//js模拟map Map = { obj : {}, put : function(key , value){ this.obj[key] = value; }, get : function(ke ...