講師：蘇鵬
布局發(fā)展概況
網(wǎng)頁(yè)中的布局與塊
DIV + id：url重寫(xiě)技術(shù)
footer, top, main,
亂而無(wú)序
新的布局標(biāo)記
header,hgroup,article,section,aside,footer
專(zhuān)注于內(nèi)容，不專(zhuān)注于形式
所有標(biāo)記 http://www.w3.org/TR/html-markup/
新布局元素概述
從頭開(kāi)始
Header:出現(xiàn)在頁(yè)面最前面的內(nèi)容
hgroup:在header里的
<header>
<img>
<hgroup>
<h1>
<h2>
</hgroup>
</header>
大塊文章
<article>
<img>
<h2>
<address>
<time>
</article>
日期和時(shí)間
<address>
Written by w3schools.com <br />
<a href="mailto:us@example.ort">Email us</a> <br />
Address: Box 564, Disneyland<br />
Phone:+12 34 56 78
</address>
<p>I have a date on <time datetime="2008-02-14">Valentines day</time></p>
<p>We open at <time>10:00</time> every morning.</p>
推薦使用第一種
Footer
<footer>
<p>
<nav>
<h3>
<div>
<a>
</div>
</nav>
</footer>
區(qū)域與塊
Aside
section
整體布局
兩類(lèi)控件：內(nèi)容控件+功能控件
與布局無(wú)關(guān)的
Figure
Figcaption
<figure>
<p>A view of the pulpit rok in Norway</p>
<img src="img_pulpit.jpg" width="304" height="228" />
</figure>
漢字元素
Ruby
<ruby>
韓<rt>safsdf</rt>
</ruby>
Time
日期
Compontent syntax Example
Date yyyy-mm-DD 2011-07-13
Time with hours hh:mm 18：28
Time with seconds hh:mm:ss 18:28:05
Time with milliseconds hh:mm:ss.f 18:28:05.2318
Date and time T to join date and 2011-07-12718:28
time
With time zone GMT Z at the end 2011-07-13T18:28:05Z
With time zone as offset +mm:hh / -mm:hh 2011-07T18:28:05+02:00
總結(jié)：
新的布局方式
新標(biāo)簽：為搜索引擎提供友好支持，后續(xù)操作的方便。
html4有沒(méi)有辦法一下切換到html5
精髓：在API上，為了方便切換到html5，現(xiàn)在規(guī)范css，往html5現(xiàn)有的規(guī)范邊上靠，使用w3c的標(biāo)記。