video通过<video>标签，我们可以抛弃最近不怎么讨好的Flash，直接在页面中播放视频文件。视频文件自然是最符合语义化的文件格式，但该元素标签同样支持音频与图片。过去(及目前)，我们通常要使用类似下面这样繁冗丑陋的代码来将视频放置在页面中，但这种方式要求浏览器安装有Flash插件，并支持JavaScript：<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="425" height="344" codebase="http://download.macr...
HTML5为input的type类型增加了多种枚举值，用来表达不同的意思，同事具有验证功能，如果格式不对，浏览器将原始提供错误提示，堪称超级牛X啊，具体如下：Keyword Data type hidden任意字符text单行文本search单行文本tel单行文本url绝对地址email一个或多个email地址password单行文本datetime带有时区的时间date无时区的年月日时间month无时区的年月week无时区的周数time无时区的时间（小时，分钟，秒，毫秒）datetime-local无时区...
改变的元素（Element）以下元素在HTML5里的用法稍作修改以便能在web里更好的使用或者起到更大作用：没有href属性的a元素将显示成一个占位符，而且a元素内部现在支持flow content类型的元素了（例如：article, input, span等）。address可以被article, aside, nav, section限定范围了，以前只能作用于全局范围。b元素现在描述为在普通文章中仅从文体上突出的不包含任何额外的重要性的一段文本。例如：文档概要中的关键字，评论中的产...
a和area下的media属性为了和link元素保存一致性，a元素和area元素也都增加了media属性，只有在href存在时菜有效。media属性的意思是目标 URL 是为何种媒介/设备优化的，默认值是all，详细语法规范请访问：http://dev.w3.org/csswg/css3-mediaqueries/#media0代码示例：<a href="att_a_media.asp?output=print" media="print and (resolution:300dpi)"> HTML5 a media attribute. </a>area下的hreflang, type, rel属性为了保存和a元...
废弃的元素（Element）这个小节里列出的元素在HTML5里将不再使用，现有文档升级到 HTML5的话可以使用一些替代方案。例如parser section 可以处理isindex 元素的功能。下面的元素被废弃的原因是用CSS处理可以更好地替代他们：basefontbigcenterfontstrikett下面的元素被废弃的原因是他们的使用破坏了可使用性和可访问性：frameframesetnoframes下面的元素被废弃的原因是不经常使用他们，也会引起混乱，而且其它元素也可以很好地实现...
HTMLDocument上的扩展HTML5在DOM Level 2 HTML上扩展了一些HTMLDocument的接口。这些接口在所有实现了Document接口的元素对象上进行了实现。HTML5在里面也新增加了几个成员：getElementsByClassName()：用class类获取元素，用这个方法可以查询任何带有class属性且带有符合该class参数值的元素和Document对象（例如：SVG和MathML）。innerHTML：一种解析和序列化HTML/XML文档的方式，该属性在以前版本的浏览器里只支持HTMLElement并...
html5文档必须以开头lang为属性，属性值为en（定义语言为英语）或zh-CN（定义语言为中文）如果浏览器遵循w3c标准，lang属性可以用来定义样式，class定义了主要的样式，lang属性可以在此基础上做出修改，比如：p｛ font-family: "宋体" font-size: 14px; color: #F00;}p:lang(zh-CN){ font-family: "宋体"}p:lang(en-US){ font-family: Arial} 这里p标签的主要CSS只定义了字体大小和颜色，然后就需要通过标签的la...
在canvas中当在canvas上写width和height时为canvas的实际画板大小，默认情况下width为300px，height为150px。 在style里面写css样式的时候widht和height为实际显示尺寸大小。 现在以用canvas画一个对角线为例： 代码如下: canvas window.onload = function(){ getCanvas(); }; //canvase绘图 function getCanvas(){ //获得canvas元素及其绘图上下文 var canvas = document.getElementById('canvasId'); var context = canvas.g...
判断浏览器是否支持canvas，具体代码如下： 代码如下: canvas window.onload = function(){ /**判断浏览器是否支持canvas**/ try{ document.createElement('canvas').getContext('2d'); var addDiv = document.createElement('div'); addDiv.innerHTML='支持canvas'; document.body.appendChild(addDiv); }catch(e){ var addDiv = document.createElement('div'); addDiv.innerHTML='浏览器不支持canvas'; document.body.appen...
上一篇介绍了html5标签video（播放器）初始化需要做的一些工作，如何简单快速使用html5的播放器，本文将重点介绍如何用JS来操作video标签，也就是如何对video做一些简单基本的操作，包括了播放器的播放、暂停，音量的读取、设置等写相关操作，从而开始播放器的扩展之路。 本文的目录： 1.获取影片总时长2.播放、暂停3.获取影片已播放时间和设置播放点4.音量的获取和设置 第一、获取影片总时长 对播放器（video）操作，首先要得...
近有在学习html5中video标签（播放器）的使用，这里做一些学习笔记，方便自己查阅和记录，本文是第一篇，将介绍的是使用该标签初始化该做的哪些工作。 网上的教程其实也不少了 w3cschool里面的最为简单而详细，那么这几介绍的是一些更为直接的应用。 本文目录: 1.使用标签2.加上一些必要参数3.自动播放或自动加载4.规范播放器 第一步：使用标签 使用的方法很简单，就是一句代码：代码如下: 第二步：加上一些必要的参数，比如播放...
一，开篇分析 好了，废话不多说，直接进入今天的主题，今天主要讲的是“History API”及在单页应用中的作用，并且会引入一个实际的例子做为讲解的原型范例，先来看看“History API”：为了提高Web页面的响应速度，越来越多的开发者开始采用单页面结构（single-page application）的解决方案。所谓的单页面结构就是指多个页面间切换时，不刷新当前整个页面，更新页面展示数据，并且相应地改变地址栏中的url，以使用户可以分享这个ur...
一. HTML5语法的改变 该知识点所说变化指的是基于HTML4基础上所定义的改变，主要有如下： 1.HTML5的文件扩展符(.html或.htm)与内容类型(text/html)保持不变。 2.HTML5中，刻意不使用版本声明，一份文档将会适用于所有版本的HTML。 3.从HTML5开始，对于文件的字符编码推荐使用UTF-8。 4.HTML5确保了与之前HTML版本的最大程度的兼容性。 为了保证兼容性，需从元素说起，在HTML5.中，元素的标记可以省略。其体来说，元素的标记分为&ld...
这篇文章介绍的内容是关于HTML学习笔记一 ，有着一定的参考价值，现在分享给大家，有需要的朋友可以参考一下在点击打开链接的学习总结。HTML常用的标签及解释1、基本格式框架<html> <body> <h1>标题</h1> <p>段落</p> </body> </html>2、文本格式化标签<b>粗体</b> <big>大号字</big> <em>着重字（粗）</em> <i>斜体字</i> <strong>加强语气（粗）</strong> <sub>下标</sub> <sup>上标</sup> <ins>插入字</ins> <del>删除字</del>3...
这篇文章介绍的内容是关于HTML学习笔记二 ，有着一定的参考价值，现在分享给大家，有需要的朋友可以参考一下1、表格<table><table border="1"> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </table><tr>......</tr>定义行，<td>......</td>定义列表头表示：<tr> <th>heading</th> </tr>如果要表示一个空行，可以用 空格占位符填充。2、列表第一种：无...