html5新特性之语义化标签

html5新特性之语义化标签

优点

• 可以使页面在未使用CSS的情况下呈现内容结构、代码结构
• 利于SEO
• 遵循W3C标准

语义化标签

• header:

  <header>
    <!-- 放在页面或布局的顶部 （非必须）,一个文档中可以包含一个及以上的header标签-->
  </header>

• hgroup

<hgroup>
    <!-- 包裹连续多个h1-h6标签 -->
  </hgroup>

• nav

  <nav>
    <!-- 为了利于SEO，将主要链接放在nav中 -->
  </nav>

• article

 <article>
    <!-- 若页面中需要一个单独的模块来实现一个单独的功能 -->
  </article>

• section

  <section>
    <!-- 包含一个明确主题的内容 -->
  </section>

• aside

 <aside>
    <!-- 不是页面主要内容，具有独立性，对页面的补充 -->
  </aside>

• footer

  <footer>
    <!-- 防止页面或区块底部，一般包含版权信息、联系方式等 -->
  </footer>

页面结构示意图