HTML5中最新的标签学习总结

HTML5中最新的标签学习总结

像我一样在课工场学习过的小伙伴肯定会有一些统一的观点，就是在课工场学习的时候，总是能在我们从来没有意识到的情况下，被加入了新的课程内容。虽然大家都是不喜欢拖堂的课程，但是在课工场我们渴望老师拖堂，毕竟每次拖堂都是老师为我们总结了一些新的知识点内容，这样的情况下，我们就可以比别人掌握更多的知识点。下面我私自将老师分享过的HTML5中的新的标签，加上我个人的一些整理给大家分享一下。

标签article:

表示包含于一个文档、页面、应用程序或网站中的一段独立的内容，也就是说，它能够独立地被发布或重新使用。

标签header

一般被放置在页面的顶部，或者页面中某个区块元素的顶部，包含整个页面或某个区块的标题、简介等信息。

一个文档中可以包含多于一个的header标签;header标签不一定非要显示在页面的上方，它的内容决定这里需要使用header标签，位置并不重要;可以为body,article,section和aside增加header元素。

标签footer

一般被放置在页面的底部，或者页面中某个区块元素的底部。

标签nav

表示页面的导航,可以通过导航连接到网站的其他页面，或当前页面的其他部分。

搜索引擎或屏幕阅读器会根据nav标签确定网站内容，不是任何一组超链接都适合放在nav标签中。（WEB前端交流君/羊172<99<41<55  ，ww，艳怔）

标签aside

包含的内容不是页面的主要内容，具有独立性，是对页面内容的补充。

一些使用aside的例子：页面侧边栏;广告;友情链接;文章引语(内容摘要)。

标签section

一个主题性的内容分组，通常包含一个头部(header)，可能还会有一个尾部(footer)。

标签div和section的比较：标签div应用更广泛，只要你想为一个区域定义一个样式，就可以使用div标签;标签section包含的内容是一个明确的主题，通常有标题区域。

标签main

显示页面的主体内容;每个页面只能包含一个main标签;main标签中不包含网站标题、logo、主导航、版权声明等信息。

标签figure

定义媒介内容的分组，以及它们的标题。

标签figcaption

定义figure元素的标题。

文本级别的语义标签：

标签time

HTML5的新标签。表示一个日期，或者一个时间，或者同时表示一个日期和时间值。

标签i和b

HTML4中已经存在，在HTML5中被赋予了新的语义化功能的标签。

标签i

在HTML4中，是修饰文字样式的，将文字显示为斜体文本;在HTML5中，表示强调不同的情绪或声音，也可以表示技术术语、生物分类、来自另一种语言的成语或习语、一个想法等等。

标签b

在HTML4中，是修饰文字样式的，将文字显示为粗体文本;在HTML5中，表示文档中的关键字、商品名称等。

标签em和strong

在HTML4中就已经有了语义化的功能。

标签em：emphasis 强调，标签中的内容是用来强调的重点内容，会被浏览器显示成斜体文本。

标签strong：

表示非常重要、严重性或内容的紧迫性;会被浏览器显示成粗体文本。

使用建议：如果你只是单纯的想把文字的样式显示为斜体或粗体，请不要使用这几个语义标签，W3C建议我们要在CSS样式表中定义文字样式。

大家共同进步才是课工场连当时告诉我们的学习的本质，像别人那样学习期间钩心斗角在课工场是看不到的，我们是一个整体，希望更多的朋友能加入到我们这个大家庭中（WEB前端交流君/羊172<99<41<55  ，ww，艳怔），来收获更多属于自己的那一份技术。