【教学课件】第10章-HTML5的结构

1、.1在HTML5的新特性中，新增的结构元素主要功能就是解决之前在HTML4中Div漫天飞舞的情况，增强网页内容的语义性，这对搜索引擎而言，将更好识别和组织索引内容。合理地使用这种结构元素，将极大地提高搜索结果的准确度和体验。新增的结构元素，从代码上看，很容易看出主要是消除Div，即增强语义，强调HTML的语义化。.2新增的主体结构元素 新增的非主体结构元素 .3在HTML 5中，为了使文档的结构更加清晰明确，容易阅读，增加了很多新的结构元素，如页眉、页脚、内容区块等结构元素。.4article元素可以包含独立的内容项，可以包含一个论坛帖子、一篇杂志文章、一篇博客文章、用户评论等。这个元素可以将

2、信息各部分进行任意分组，而不论信息原来的性质。10.1.1 article10.1.1 article元素元素.5section元素用于对网站或应用程序中页面上的内容进行分块。一个section元素通常由内容及其标题组成。但section元素也并非一个普通的容器元素，当一个容器需要被重新定义样式或者定义脚本行为的时候，还是推荐使用Div控制。10.1.2 section10.1.2 section元素元素.6nav元素在HTML5中用于包裹一个导航链接组，用于说明这是一个导航组，在同一个页面中可以同时存在多个nav。10.1.3 nav10.1.3 nav元素元素.7aside元素用来表示当前

3、页面或文章的附属信息部分，它可以包含与当前页面或主要内容相关的引用、侧边栏、广告、导航条，以及其他类似的有别于主要内容的部分。10.1.4 10.1.4 asasi idede元素元素.8除了以上几个主要的结构元素之外，HTML5内还增加了一些表示逻辑结构或附加信息的非主体结构元素。.910.2.1 10.2.1 h he eaderader元素元素header元素是一种具有引导和导航作用的结构元素，通常用来放置整个页面或页面内的一个内容区块的标题，header内也可以包含其他内容，例如表格、表单或相关的Logo图片。.1010.2.2 header10.2.2 header元素元素heade

4、r元素位于正文开头，可以在这些元素中添加标签，用于显示标题。基本上，标签已经足够用于创建文档各部分的标题行。但是，有时候还需要添加副标题或其他信息，以说明网页或各节的内容。.1110.2.3 footer10.2.3 footer元素元素footer通常包括其相关区块的脚注信息，如作者、相关阅读链接及版权信息等。footer元素和header元素使用基本上一样，可以在一个页面中使用多次，如果在一个区段后面加入footer元素，那么它就相当于该区段的尾部了。.1210.2.4 address10.2.4 address元素元素address元素通常位于文档的末尾，address元素用来在文档中呈现联系信息，包括文档创建者的名字、站点链接、电子邮箱、真实地址、电话号码等。address不只是用来呈现电子邮箱或真实地址这样的“地址”概念，而应该包括与文档创建人相关的各类联系方式。.1310.3经典习题1. 1. 填空题填空题（1）_元素可以包含独立的内容项，可以包含一个论坛帖子、一篇杂志文章、一篇博客文章、用户评论等。（2）_元素在HTML5中用于包裹一个导航链接组，用