HTML5是对HTML的第5次重大的修改，虽然HTML5 标准还在制定中，但不能阻碍其势不可挡的脚步，不用HTML5你就OUT了。HTML5与我们常用的HTML4有什么区别呢？

首先要说的是不是所有的浏览器都支持HTML5,Safari、Chrome、Firefox 以及 Opera 支持某些 HTML5 特性。Internet Explorer 9 将支持某些 HTML5 特性。

下面是在把我个人将网页换成html5标准时所做的改变：
1、换一个W3C标准声明<!doctype html>，少了不少代码，页面干净，爽
2、对于HTML5的标签，IE9之前的版本无法提供支持,为了兼容老版本的浏览器，必须做些额外的工作，十分不爽，要在<head>里引入一个html5.js帮助旧版本的IE浏览器创建HTML5元素节点,麻烦。

<!--[if lt IE 9]>

<script src="js/html5.js"></script>

<![endif]-->

为了正确显示，CSS中增加如下设置：

header, section, footer, aside, nav, main, article, figure {
    display: block;
}

3、 使用一些更语义化的标签， 如<header><footer><section><article><menu><figure> 用法：<div class="header"></div>,改为<header></header>，少定义不少 class，HTML干净，有利于SEO,爽。
4、删除了我常用的<b> 和 <font>，好吧，删就删，无感。删除 <frame>, <center>, <big> 标签，多年没用过了，无感。
难道只是这些标签的小改动，就能让HTML5的概念风卷残云吗？我想肯定不是，那么，HTML5的精髓在哪呢？
这个问题我回答不了，查一下资料总结一下：

一、代码更清晰，语义更明确，这几乎是很多人使用它的全部
二、HTML5是最移动化的开发工具。现在越来越多的用户选择使用移动设备访问网站或者web应用。
三、游戏开发
可以使用HTML5的<canvas>开发游戏。HTML5提供了一个非常伟大的，移动友好的方式去开发有趣互动的游戏。如果你开发Flash游戏，你就会喜欢上HTML5的游戏开发。canvas只是一个画布，HTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像。
四、本地存储

HTML5中最酷的特性就是本地存储。有一点像比较老的技术cookie和客户端数据库的融合。它比cooke更好用因为支持多个windows存储，它拥有更好的安全和性能，即使浏览器关闭后也可以保存。

因为它是个客户端的数据库，你不用担心用户删除任何cookie，并且所有主流浏览器都支持。

本地存储对于很多情况来说都不错， HTML5工具中一个不需要第三方插件实现的。能够保存数据到用户的浏览器中意味你可以简单的创建一些应用特性例如：保存用户信息，缓存数据，加载用户上一次的应用状态。
五、视频和音频支持
视频和音频通过HTML5标签<video>和<audio>来访问资源，不再需要Flash和第三方插件。正确播放媒体一直都是一个非常可怕的 事情，你需要使用<embed>和<object>标签，并且为了它们能正确播放必须赋予一大堆的参数。你的媒体标签将会非常复 杂，大堆得令人迷惑的代码。而且HTML5视频和音频标签基本将他们视为图片：<video src=”"/>。但是其它参数例如宽度和高度或者自动播放呢？不必担心，只需要像其它HTML标签一样定义：<video src=”url” width=”640px” height=”380px” autoplay/>。

实际上这个过程非常简单，然而我们的老浏览器可能并不喜欢我们的HTML5，你需要添加更多代码来让他们正确工作。但是这个代码还是比<embed>和<object>来的简单的多。

 

HTML5的入门与深入理解的更多相关文章

  1. 02.Web大前端时代之：HTML5+CSS3入门系列~H5结构元素

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 1.结构元素 可以理解为语义话标记,比如:以前这么写&l ...

  2. html5 基础入门

    html5 基础入门 前言介绍 HTML5草案的前身名为 Web Applications 1.0,于2004年被WHATWG提出,于2007年被W3C接纳,并成立了新的 HTML工作团队. 如果从狭 ...

  3. Web大前端时代之：HTML5+CSS3入门系列

    准备来一波新技术,待续.... Old: 联系源码:https://github.com/dunitian/LoTHTML5 文档下载:https://github.com/dunitian/LoTD ...

  4. 07. Web大前端时代之：HTML5+CSS3入门系列~H5 地理位置

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 源码:https://github.com/duniti ...

  5. 01.Web大前端时代之：HTML5+CSS3入门系列~初识HTML5

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 文档申明 <!--文档类型申明,html代表是ht ...

  6. 03.Web大前端时代之：HTML5+CSS3入门系列~H5功能元素

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 2.功能元素 1.hgroup 对网页或区段(secti ...

  7. 04. Web大前端时代之：HTML5+CSS3入门系列~HTML5 表单

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 一.input新增类型: 1.tel:输入类型用于应该包 ...

  8. 05. Web大前端时代之：HTML5+CSS3入门系列~H5 多媒体系

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 1.引入 概述 音频文件或视频文件都可以看做是一个容器文 ...

  9. 06. Web大前端时代之：HTML5+CSS3入门系列~HTML5 画布

    Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 我们先看看画布的魅力: 初始画布 canvas默认是宽3 ...

随机推荐

  1. linux6.*无法正常启动has进程解决方案

    1. 数据库安装成功之后:发现ohasd进程存在异常:[root@oracle234 ~]# su - grid[grid@oracle234 ~]$ ps -ef| grep ohasdgrid   ...

  2. [比较老的文章]三维渲染引擎 OGRE 与 OSG 的比较综述

    1 .引言随着计算机可视化.虚拟现实技术的飞速发展,人们对实时真实感渲染以及场景复杂度提出了更高的要求.传统的直接使用底层图形接口如OpenGL.DirectX开发图形应用的模式越来越暴露出开发复杂性 ...

  3. [Machine-Learning] 熟悉 Matlab 中的 map

    概述 map 的意思是映射,即将一个变量映射到另一个变量. 比如将一个字符串映射为一个数值,那个字符串就是map 的键值(key),数值就是map的数据(value). 由此可以把map理解为一个哈希 ...

  4. Eclipse 代码格式：“{ }”的格式设置

    Eclipse设置代码大括号的格式 编写代码有很多中风格,常见的三种风格: 1.K & R风格:这种风格的代码比较紧凑,优点是在教科书或者打印成纸张的时候比较省地方:缺点是大括号匹配问题,代码 ...

  5. mac终端命令大全介绍(转)

    OSX 的文件系统 OSX 采用的Unix文件系统,所有文件都挂在跟目录 / 下面,所以不在要有Windows 下的盘符概念. 你在桌面上看到的硬盘都挂在 /Volumes 下. 比如接上个叫做 US ...

  6. all ,any，abs的使用

    #!/usr/bin/env python #all循环参数,如果每个元素都为真,那么all的返回值为真 r = all([True,'sad','asd']) print(r) #any 只有一个真 ...

  7. javascript对象创建方式

    工厂模式 在ECMAscript中无法创建类,所以开发人员就发明了一种函数,用函数来封装,以特定接口创建对象的细节,如下面的例子所示: function createPerson(name,age,j ...

  8. centos 6.4 升级python到版本2.7.12

    注意:需要root权限 查看python版本:python --version 1.下载Python-2.7.12wget https://www.python.org/ftp/python/2.7. ...

  9. MyEclipse中的SVN操作手册

    原文出处:http://blog.sina.com.cn/s/blog_8a3d83320100zhmp.html 1.导入项目 点击工具栏上的[File-Import],进入下图 (如果你的对话框中 ...

  10. treap 模版

    struct Treap { struct node { node *son[]; int key,siz,wei,cnt; node(int _key,node *f) { son[]=son[]= ...