html5学习笔记之一（新的页面组织标记）

看视频，做笔记：

html5主要专注于内容不注重形式。

一、头部标记

1.header：一般用于头条醒目的新闻，但可以用于页面的任何部分。可以嵌套，但不能嵌套在footer和adress中（adress用来描述地址信息，footer用于描述尾部信息）。

2.hgroup：用于在header中定义详细信息，可以认为header是一个大容器，而hgroup是一个小容器。hgroup可用h1到hn的分类一一定义内容，如：

<header>

    <img>

    <hgroup>

        <h1>

        <h2>

    </hgroup>

</header>

使用header的意义：虽然可以用div来代替header，但header的意义在于告诉搜索引擎该部分内容是头部标记，一般用来放导航或显示信息或标记。

二、内容

3.article：大块文章。有四种常见用途：整版内容、.报纸、博客、用户反馈。本身作为一大容器，可以使用一些标签，如adress、time等（adress用来介绍制作人信息、地址信息等内容，它是一个封闭标签，可放文字、图片及其他数据类型，time用于显示时间日期的，可以调整日期显示方式）。如：

<article>

<img>

<h2>

<adress>

<time>

</article>

 

<adress>

written by w3schools.com<br/>

<a href = haha@foxmail.com>Email us </a> <br/>

adress :china, guangdong<br />

phone:simaba

</adress>

 

<p> I have a data on <time datatime = "2010-05-20">a good day</time> </p>

<p>we open at <time>10:00</time>every morning</p>

三、尾部

4.footer：显示页面当中最下方的信息，也可以放在页面的任何地方，里面也可以嵌入一些标签。

四、区域与块

5.aside：表示和某个区块之间的关系，一般显示在其旁边。

6.section：专门做容器，当有一组逻辑上有关的东西，需要统一呈现的时候需要用此标签圈起来。可以嵌套在side或其他部分。

五、整体布局

可分为两大类控件：1.内容控件，放些纯粹内容性的东西；2.功能控件，有一些指示性的信息，如功能区域的划分等。

六、与布局无关的

figure和figcapiton标签与整体布局无关，有和没有均无影响。

七、汉字元素

如果系统里没有汉字或日文的字库，如果要显示的话，需要使用ruby标签。如：

<ruby> 汉字 </ruby>