笔记 - HTML5网页设计初窥（2）

笔记 - HTML5网页设计初窥（2）

讲师：苏鹏 
    布局发展概况
        网页中的布局与块
            DIV + id：url重写技术
                footer, top, main,
            乱而无序
        新的布局标记
            header,hgroup,article,section,aside,footer
            专注于内容，不专注于形式
            所有标记 http://www.w3.org/TR/html-markup/ 
    新布局元素概述 
    从头开始
       Header:出现在页面最前面的内容
            
        hgroup:在header里的
            <header>
                <img>
                <hgroup>
                     <h1>
                     <h2>
                 </hgroup>
            </header>
        大块文章
            <article>
                <img>
                <h2>
                <address>
                <time>
            </article>   
        日期和时间
        <address>
            Written by w3schools.com <br />
        <a href="mailto:[email protected]">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>
    区域与块
        Aside
        section
    整体布局
        两类控件：内容控件+功能控件
    与布局无关的
        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

总结：
        新的布局方式
            新标签：为搜索引擎提供友好支持，后续操作的方便。
                       html4有没有办法一下切换到html5
         精髓：在API上，为了方便切换到html5，现在规范css，往html5现有的规范边上靠，使用w3c的标记。