HTML5学习之文档结构和语义(一)

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
</head>
    <body>
        <!--header 和hgroup-->
        <!--header标签在语法规范中包含标题、标题介绍或标题导航。header不允许嵌套,也不允许出现在地址或者footer元素内-->
        <header>
            <img />
            <hgroup>
                <h1>
                    
                </h1>
                <h2>
                </h2>
            </hgroup>
        </header>
        <!--article-->
        <!--article元素对应Web页面中的一个独立区域,该区域可包含新闻、博客文章之类的内容-->
        <div>
            <article>
                <img />
                <h2></h2>
                <address></address>
                <time>2014-8-4</time>
            </article>
        </div>
<!--        aside元素作用于页面上一些与主题联系不大而相对独立的区域。
        section元素作用于同一主题下不同的文档部分,例如论文各章节或是表单页面中的独立表格。-->
        <aside>
            <h2></h2>
            <section>
                <h3></h3>
                <p></p>
                <input />
            </section>
            <section>
                <h3></h3>
                <p></p>
                <input />
            </section>
            <nav>
                <h3></h3>
                <ul>
                    <li></li>
                </ul>
                <a></a>
            </nav>
        </aside>
        <!--一个figure中只能包含一个figcaption元素,实际上不能算作结构性元素,但在组织独立图片、图像、图标以及编码列表不错-->
        <figure>
            <img />
            <img />
            <img />
            <figcaption>
                图片说明
            </figcaption>
        </figure>
        <!--bei  jing
               北   京-->
        <ruby><rt>bei</rt><rt>jing</rt>
        </ruby>
        <!--mark 高亮标记一段文字-->
        <mark>高亮标记一段文字</mark>
        <!--wbr 破折号,没有结尾-->
        <wbr>用于让浏览器为长单词增加<wbr>可选择的破折号,以便自动折行
        www.simply<wbr>orange<wbr />juice.com
        <!--footer并非必须出现在页面底部,它也可以是article元素的一部分。footer不能嵌套,也不能在header或address里。-->
        <!--nav导航-->
        <footer>
            <p></p>
            <nav>
                <h3></h3>
                <div>
                    <a></a>
                </div>
            </nav>
        </footer>
    </body>
</html>

 

posted @ 2014-08-04 16:34  学亮  阅读(284)  评论(0编辑  收藏  举报