快速查询

article | aside | nav | section | header | footer

架构预览

nav 定义导航链接的部分

在页脚显示一个站点的导航链接,如首页、服务信息页面、版权信息页面等

article 定义文章

装载显示一个独立的文章内容，论坛帖子、新闻、博客文章、用户评论等，artilce可以嵌套，则内层的artilce对外层的article标签有隶属的关系。

    
标题
    
 内容
    
用户评论
    
回复评论

section 定义文档中的节

章节、页眉、页脚或文档中的其他部分，

   
标题1
   
内容1


   
标题2
   
内容2

aside 定义文章的侧栏

广告，成组的内容，友情链接，侧边栏等

header 定义文档的页眉

通常是一些引导和导航信息

 
     
logo
 
      

footer 定义文档或节的页脚

在典型情况下，该元素会包含创作者的姓名、文档的创作日期以及/或者联系信息

参考文献

1 html5 | https://www.iwyv.com/d/files/20220205/sbymidnadso
2 w3school | https://www.iwyv.com/d/files/20220205/5wqpdtkzewy
3 MDN | https://developer.mozilla.org/zh-CN/docs/Web/HTML/

下面是其它网友的补充

百度 IFE 任务一要求构建一个页面结构，看似简单，但需充分考虑到语义化。这篇文章简单谈谈 HTML5 语义化中的页面结构语义化的一些经验和理解。

1、为什么需要语义化

易修改、易维护。
无障碍阅读支持。
搜索引擎友好，利于 SEO。
面向未来的 HTML，浏览器在未来可能提供更丰富的支持。

2、结构语义化

语义元素均有一个共同特点——他们均不做任何事情。换句话说，语义元素仅仅是页面结构的规范化，并不会对内容有本质的影响。

下图展示了一个典型的页面结构。

头部