html5中有哪些语义化标签

     
毕业生实习
     2016/08/05


...

    

        
网站标题
        
网站副标题
    

...

...

用法：

• 可以是“网页”或任意“section”的底部部分；

• 没有个数限制，除了包裹的内容不一样，其他跟header类似。

• 多用于包含服务条款，友情链接、作者信息、版权信息等

4. hgroup元素：“网页”或“section”的标题

当元素有多个层级时，该元素可以将h2到h7元素放在其内，譬如文章的主标题和副标题的组合

    
主标题
    
HTML 5

用法：

• 如果只需要一个h2-h7标签就不用hgroup

• 如果有连续多个h2-h7标签就用hgroup

• 如果有连续多个标题和其他文章数据，h2-h7标签就用hgroup包住，和其他文章元数据一起放入header标签

5.section标签：定义文档中含有标题和段落的区域。（强调分段或分块）

  
section要包含标题
  
section要包含内容...

用法：

• article、nav、aside可以理解为特殊的section，所以如果可以用article、nav、aside就不要用section，没实际意义的就用p

• 当容器需要标题和内容时，建议使用section标签，若只是普通的容器，应该用p元素较好！section标签非p！

6.article：代表独立、完整、可独自被外部引用的内容（博客或报刊中的文章、一遍论坛帖子、一段用户评论或独立的插件、或任何独立的内容）;（强调的是独立性！可含有完整的标题、内容、脚注)

   

     
标题处
   
   
内容描述
   

用法：定义一个独立完整的内容部分（可包含标题，内容，脚注）时使用！

article、section间的相互嵌套关系：

7. aside标签：表示当前页面或文章的附属信息部分，可包含于当前页面或主要内容相关的引用、侧边栏、广告、导航条、以及其他类似的有别于主要内容的部分。

1.用于article标签之内，此时表示的是该独立内容的附属信息部分；

        
article内容区
        
    

2.用于article标签之外，此时作为页面或站点全局的附属信息部分。

用法：

• aside在article内表示主要内容的附属信息

• 在article之外则可做侧边栏，页面或站点全局的附属信息部分

• 如果是广告，其他日志链接或者其他分类导航也可以用

（一句话概括：不同的位置表示为对应区域的附属信息！）

8. figure标签：规定独立的流内容（图像、图表、照片、代码等等）。

figcaption标签：用于元素定义figure的标题。

1.一个figure元素内最多只允许放置一个figcaption元素，其他元素可无限放置。

2.figcaption 元素应该被置于 figure元素的第一个或最后一个子元素的位置。

9. time标签：定义时间或日期

定义时间...9:00

结合datetime属性定义日期...时间

10. address标签：代表区块容器，必须是作为联系信息出现，邮编地址、邮件地址等等,一般出现在footer。

表示文档或文章的作者/拥有者的联系信息，在body标签中表示文档的作者的联系信息；在article标签中表示文章作者的联系信息；

用法：

• 标签不应该用于描述通讯地址，除非它是联系信息的一部分。

• 元素通常连同其他信息被包含在 footer 元素中。

关于html5中有哪些语义化标签就分享到这里了，希望以上内容可以对大家有一定的帮助，可以学到更多知识。如果觉得文章不错，可以把它分享出去让更多的人看到。