HTML5:《HTML5. Up and Running》读书笔记.Chp3.Elements

分类:HTML5、CSS3 发表时间:2011年03月21日 字体大小:12号14号

即上篇的特性章节之后,继续更新我的HTML5读书笔记。本篇主要记录一些标签方面的更新注意事项。一些普通的header、nav、article等标签的用法网上是一大堆,我只是把我觉得这方面重要的内容或者不容易记住的内容做了一个备份。

这些新的HTML5标签在IE8及以下版本中都不能支持,这就需要在页面加载之前使用JS动态地创建HTML5新标签,以实现页面的正确的渲染。当然这样处理并不是万能的,在处理一些AJAX交互时,就会出现返回的HTML5标签无法正确解析的问题。此时就需要HTML5 innerShiv来解决了。

1. Doctype:

1
< !DOCTYPE html>

无需再去添加XHTML的框架型、过渡性或者严谨型的声明。

2. HTML

1
2
<html lang="en">
</html>

无需再添加xmlns属性来约束标签的命名空间了。

3. HEAD:

1).meta:
1
<meta charset="utf-8" />
2).link:
2.1).rel=”stylesheet”
1
<link rel="stylesheet" href="style-original.css" />
2.2).rel=”alertnate” //用在订阅
1
<link rel="alternate" type="application/atom+xml" title="My Weblog feed" href="/feed/" />
2.3).rel=”icon”
1
<link rel="shortcut icon" href="/favicon.ico"></link>

4. How to style unknown elements in IE:

1
2
3
4
5
6
7
8
9
10
     <!--[if lt IE 9]>
          <script type="text/javascript">
               var e = ("abbr,article,aside,audio,canvas,datalist,details," +
                         "figure,footer,header,hgroup,mark,menu,meter,nav,output," +
                         "progress,section,time,video").split(',');
               for (var i = 0; i < e.length; i++) {
                    document.createElement(e[i]);
               }
          </script>
     < ![endif]--></script>

OR:

1
2
3
     <!--[if lt IE 9]>
          <script type="text/javascript" src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
     < ![endif]-->

5. The HTML5 algorithm says that an <article> element creates a new section, that is, a new node in the document outline. And in HTML5, each section can have its own <h1> element.

6. Time and Date:

1
<time datetime="2009-10-22" pubdate="pubdate">October 22, 2009</time>

不错不错,已经有 个评论!
  1. 正在学习HTML,楼主有没有考虑写个简单的入门分享哦~~~~

    • 你可以去w3school看啊,那里的教程足够了。

  2. 哈,以后可以常来逛逛~~~

  3. 貌似第一次过来看看

    • 希望以后可以多多地来!

  4. html5实在是太强了。ie9也开始支持html5了

    • IE9的支持没有宣传的那么好。IE在落寞了。

  5. 链接已添加!!

    • 你的也已加,多多交流!

  6. geliable 给力

  7. 有独立域名博客的个个是高手,除了我之外

  8. 又更新了啊,发现这个更新的频率真高

    • 最近比较空,积累了些东西,就更新多点。

  9. 那个“<!–[if lt IE 9]>”应该是“<!–[if lte IE 9]>”吧?还是我眼花了哦~~~

    • lte是等于小于,IE9不用包含,只需lt既可。

  10. 哈哈。我土鳖啦~~~~

    • 你怎么这么快就回复了,能收到邮件通知?

  11. 我一直能收到回复评论的呀?就在我gmail里面呀~~~

    • 是嘛,那太好了。我确实加了这功能,但自己测试的时候一直没成功,我以为就没用呢。没想到一直是OK的啊,呵呵!

  12. lte习惯了 分不出好坏了

  13. 很好,看看了

  14. 看了之后不错,支持

  15. 看了之后,非常不错

  16. 看过学习下哈