2011/01/14 14:34
文章作者:Enjoy 转载请注明原文链接。
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
国内几乎没有IE9的用户,因此,taobao是这样写的:
<!--[if IE]>
<script src="http://a.tbcdn.cn/p/fp/2011a/html5.js" type="text/javascript"></script>
<![endif]-->
<script src="http://a.tbcdn.cn/p/fp/2011a/html5.js" type="text/javascript"></script>
<![endif]-->
两个JS的内容是一样的,代码都来自:http://remysharp.com/2009/01/07/html5-enabling-script/
以下是我整理的由原来的html转换到HTML5一些注意点:
文档申明:
<!DOCTYPE html>
原来的根本记不住,每次都需要copy。这种写法还向前向后兼容。
设置页面编码:
旧:<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
新:<meta charset="utf-8">
链接样式表CSS
<link href="/css/comm_v3.css" rel="stylesheet" type="text/css">
可以不写type="text/css"了,浏览器只要看到rel=”stylesheet”就知道你是链接样式表了。
<link href="/css/comm_v3.css" rel="stylesheet">
加载JS
<script src="/js/html5.js" type="text/javascript"></script>
可以不写 type="text/javascript",浏览器默认的脚本语言就是javascript。
<script src="/js/html5.js"></script>
可以简单的把所有内容都包装在一个链接元素中
<h2><a href="/path/to/resource">Headline text</a></h2>
<p><a href="/path/to/resource">Paragraph text.</a></p>
<p><a href="/path/to/resource">Paragraph text.</a></p>
可以改写为:
<a href="/path/to/resource">
<h2>Headline text</h2>
<p>Paragraph text.</p>
</a>
<h2>Headline text</h2>
<p>Paragraph text.</p>
</a>
HTML5支持已有的内容,原来的div,img,p不做任何改动,都可以在HTML5里正常使用。
原结构:
<body>
<div id="header">...</div>
<div id="navigation">...</div>
<div id="main">...</div>
<div id="sidebar">...</div>
<div id="footer">...</div>
</body>
<div id="header">...</div>
<div id="navigation">...</div>
<div id="main">...</div>
<div id="sidebar">...</div>
<div id="footer">...</div>
</body>
可以更改为:
<body>
<header>...</header>
<nav>...</nav>
<section>...</section>
<aside>...</aside>
<footer>...</footer>
</body>
<header>...</header>
<nav>...</nav>
<section>...</section>
<aside>...</aside>
<footer>...</footer>
</body>
更多推荐阅读:《HTML5设计原理》http://www.cn-cuckoo.com/2010/10/21/the-design-of-html5-2151.html
参考:
拥抱HTML5,《HTML5设计原理》读后随记

启用nginx的fastcgi cache提高网站php访问速度
怎么给mysql用户File权限?

