HTML5网页编排规范

来源：互联网发布：mac ae cc 2015 破解编辑：程序博客网时间：2024/04/29 08:55

前言：虽说自己一直在用H5，但是写代码的风格还是div+div+div，根本没有把H5的新元素用进来。这一篇做一个小结，总结H5的新元素，以及如何优雅的排版，从此抛弃div…..

新增元素

主体结构元素

article
section
nav
aside
time
具体就不说了，懂英文的应该就懂了。
就说一下time

        <time datetime="2016-5-7">2016年5月7日</time>        <time datetime="2016-5-7T12:00">2016年5月7日</time>        <time datetime="2016-5-7T12:00Z">2016年5月7日</time>        <time datetime="2016-5-7T12:00+08:00">2016年5月7日</time>

编码时机器读到的部分在datetime属性里的，datetime属性中T用来隔离时间和日期，Z加在后面表示编码时采用UTC标准时间，最后+08：00表示时差8个小时。

非主体结构元素

header
hgroup
footer
address
也没啥好说的，用在article或者section里面

编码结构

<body>    <!-- 网页标题 -->    <header>        <h1>网页标题</h1>        <!-- 网站导航链接 -->        <nav>            <li>                <a href="example.html"></a>            </li>            <li>                <a href="example.html"></a>            </li>        </nav>    </header>    <!-- 文章正文 -->    <article>        <hgroup>            <h1>文章主标题</h1>            <h2>文章子标题</h2>        </hgroup>        <p>文章正文</p>        <!-- 文章评论 -->        <section class="comment">            <h1>评论标题</h1>            <p>评论正文</p>        </section>    </article>    <!-- 版权信息 -->    <footer>        <small>版权所有：hawen</small>    </footer></body>

贴在这里，仅供参考。

0 0