H TML5 之 (1) 初识HTML5
新特性
HTML5 中的一些有趣的新特性:
- 用于绘画的 canvas 元素
- 用于媒介回放的 video 和 audio 元素
- 对本地离线存储的更好的支持
- 新的特殊内容元素,比如 article、footer、header、nav、section
- 新的表单控件,比如 calendar、date、time、email、url、search
浏览器的支持
最新版本的 Safari、Chrome、Firefox 以及 Opera 支持某些 HTML5 特性。Internet Explorer 9 将支持某些 HTML5 特性
基本格式
<!DOCTYPE html>
<html>
<head>
<!--网页的编码-->
<meta charset="utf-8"/>
</head>
<body>
<!--这是一个画布标签,我们这个这个区域绘制图形.-->
<canvas id="can1" width="500px" height="400px" style="border: 1px solid red">
</canvas>
<script type="text/javascript">
//我要在画布画出矩形.
//1. 得到画布
var canvas=document.getElementById("can1");
//2. 得到上下文环境.,我们可以通过cxt这个对象来绘制图形
//你也可以简单的理解,这个cxt就是画笔,cxt提供了很多绘制图形的方法
//通过这些方法就可以绘制图形
var cxt=canvas.getContext("2d");
//我们看看cxt是什么类型
//alert(cxt);
//画出一个矩形,默认是黑色
//改变颜色-红色
cxt.fillStyle="#FF0000";
cxt.fillRect(10,10,30,30);
</script>
</body>
</html>
到这里HTML5的最简单的预热就结束了。
H TML5 之 (1) 初识HTML5的更多相关文章
- 初识html5——试试博文编辑器
1.html5简介 HTML5 将成为 HTML.XHTML 以及 HTML DOM 的新标准. HTML 的上一个版本诞生于 1999 年.自从那以后,Web 世界已经经历了巨变. HTML5 仍处 ...
- 01.Web大前端时代之:HTML5+CSS3入门系列~初识HTML5
Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 文档申明 <!--文档类型申明,html代表是ht ...
- 初识html5的localStorage本地存储
一.概述 HTML5 提供了两种在客户端存储数据的新方法: localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储 之前,这些都是 ...
- 初识 Html5
1.1认识HTML5 HTML5并不仅仅只是做为HTML标记语言的一个最新版本,更重要的是它制定了Web应用开发的一系列标准,成为第一个将Web做为应用开发平台的HTML语言. HTML5定义了一系列 ...
- 初识html5 File API实现带有进度提示的文件上传
Html5终于解决了上传文件的同时显示文件上传进度的老问题.现在大部分的网站用Flash去实现这一功能,还有一些网站继续采用Html <form>with enctype=multipar ...
- H TML5 之 (6)下雨效果
在对HTML5进行研究之后,有了一点想法,思考出游戏其实感觉就是四个步骤 1.创建一个你需要的对象,赋予属性(一些影响方法的属性),方法(运动,叫....) 2.实例化这个对象,让它成为一个或者多个个 ...
- H TML5 之 (5) 一个在线画图板
这里加入了点难度了,增加了对HTML很多时间的把握,对象的把握 index.html <!DOCTYPE HTML> <html> <head> <title ...
- H TML5 之 (3)转动的圆球
HTML5 练手之二,一个能够为之圆心转动的圆球,原理和时钟的非常像,只是要把握转动的时间控制,同时加入了点渐变色 HTML5 练手之二,一个能够为之圆心转动的圆球,原理和时钟的非常像,只是要把握转动 ...
- H TML5 之 (4) 小项目一 时钟
这里做一个HTML5 入门的练手,一个小时钟项目,可以再上面拓展很多,程序员培养的就是思想 <!DOCTYPE HTML> <html> <head> <ti ...
随机推荐
- Trace和Debug主要用法
#region 日志记录 //System.Diagnostics.Trace.Listeners.Clear(); //System.Diagnostics.Trace.AutoFlush = tr ...
- linux VM命令下查找
使用vi编辑器编辑长文件时,常常是头昏眼花,也找不到需要更改的内容. 这时,使用查找功能尤为重要. 方法如下: 1.命令模式下输入“/字符串”,例如“/Section 3”. 2.如果查找下一个,按“ ...
- bzoj2257
不难发现其实这个捣鼓过程就是一个辗转相减所以最小燃料是瓶容量的最小公约数然后穷举约数即可 ..] of longint; n,k,x,i,m,j,t:longint; procedure sort(l ...
- 把调试好的SQL语句转换为JAVA代码小工具
关键点:Pattern实现SQL拆解.ZeroClipboard.js实现复制到剪切板 主要代码: <%@ page language="java" import=" ...
- Mac 把图片反色
黑色图变白色 1:用预览打开 2:打开"调整颜色" 3:把"自动色阶"两边的按钮, 拖动换位置,就可以看到效果了.
- ARM学习笔记13——LED驱动程序设计
首先我们要根据开发板原理图得到控制LED灯的引脚是哪个,我们现在以LED1为例,我们已经知道LED1由S5PV210的GPC1_3控制,因此我们按如下步骤进行: 第一步是配制S5PV210的GPC1_ ...
- 《C语言程序设计现代方法》第2章 C语言基本概念
C语言的基本概念 第一个C程序例子. /* pun.c */ #include <stdio.h> int main(void) { printf("To C, or not t ...
- linux 命令拾遗
man ascii 这个命令会打印出八进制.十六进制和十进制的ASCII码表. xxd xxd可以生成所给与文件的十六进制拷贝,也可以将编辑好的十六进制拷贝还原成二进制格式.它也可以将十六进制拷贝输出 ...
- Arrays.sort源代码解析
Java Arrays.sort源代码解析 Java Arrays中提供了对所有类型的排序.其中主要分为Primitive(8种基本类型)和Object两大类. 基本类型:采用调优的快速排序: 对象类 ...
- Creating InetAddress object in Java
I am trying to convert an address specified by an IP number or a name, both in String (i.e. localhos ...