代码改变世界

随笔档案-2012年06月

音频和视频

2012-06-29 13:38 by 江苏黑马, 629 阅读, 收藏,
摘要: HTML5的audio和video元素代表这音频你和视频。这里有两个概念需要先理解一下。 视频容器:这里有个封装的概念。封装了音频轨道、视频轨道、元数据(视频封面、标题、子标题、字幕)。主流视频容器支持以下格式的视频文件:.avi、.flv、.mp4、.mkv和.ogg。 音频和视频编解码器:一组用来对音频和视频编码、解码以便能正常播放的算法。主流音频编解码器:AAC、MPEG-3和Ogg Vorbis。主流视频编解码器:H.264、VP8和Ogg Theora。目前除IE以外的主流浏览器都支持audio和video。使用HTML5audio和video的优势: 浏览器自带,因而无需安装... 阅读全文

Canvas API

2012-06-29 10:03 by 江苏黑马, 12070 阅读, 收藏,
摘要: HTML Canvas API有两方面优势可以弥补:首先,不需要将所绘制图像中的每个图元当做对象存储,因此执行性能非常好;其次,在其他编程语言现有的优秀二维绘图API的基础上实现Canvas API相对来说比较简单。在网页上使用canvas元素时,它会创建一块矩形区域。默认情况下该矩形区域宽为300像素,高为150像素,但也可以自定义具体的大小或者设置canvas元素的其他特性。 1 <body> 2 <div> 3 <header> 4 <h1>index</h1> 5 </header> 6 <nav> 7 阅读全文

HTML5概述

2012-06-28 15:48 by 江苏黑马, 893 阅读, 收藏,
摘要: 对于我们要讨论的HTML5功能,不管现在支持情况如何,不久的将来肯定会变,因为HTML5发展的速度非常快。不用担心,我们会推荐一些非常好的在线资源,用以查看当前(以及将来)浏览器的支持情况。www.caniuse.com网站按照浏览器的版本提供了详尽的HTML5功能支持情况。若用户通过浏览器访问www.html5test.com的话,该网站会直接显示用户浏览器对HTML5规范的支持情况。此外,我们重点不是讨论使用某种模拟或者变通的方法让HTML5程序能够运行在旧浏览器上,而是着重关注HTML5规范本身,以及它的使用方法。也就是说,我们针对所讨论的每个API都会提供一些示例代码,开发人员可以直接 阅读全文

HTML5容易忽略的细节

2012-06-28 12:58 by 江苏黑马, 321 阅读, 收藏,
摘要: 细节一:重新定义<small>原来你可以利用<small>元素来创建与logo密切相关的副标题。不过,现在HTML5修改了这个用法,<small>元素被重新定义了,或者更恰当地说,它现在用来代表小字或其他边注(如,网站底部的版权声明)。不在需要脚本、链接类型很可能你仍然像下面的代码一样给你的链接和脚本标签添加类型的属性1 <link rel=”stylesheet” href=”path/to/stylesheet.css” type=”text/css” />2 <script type=”text/javascript” src=”pa 阅读全文

HTML5表单

2012-06-28 09:35 by 江苏黑马, 2083 阅读, 收藏,
摘要: HTML5输入类型:search、url、email、tel、number、range、color、Date pickers (datetime,date, month, week, time,datetime-local)。由于当前浏览器支持效果不好,以下测试是在多个浏览器中的结果searchemailurlnumberrange datetelcolor代码: 1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="t 阅读全文

HTML5入门教程一

2012-06-27 16:43 by 江苏黑马, 3854 阅读, 收藏,
摘要: 1、HTML5新增基础语义标签 article aside figcaption figure footer header hgroup mark nav section time 下面一段代码展示了这些标签的使用场所 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <title>HTML5新增语义标签</title> 阅读全文