新增语义标签

Posted 2021-01-10 xiaowie

Article标签：表示包含于一个文档，页面,应用程序或网站中的一段独立的内容，也就是说，他能独立地被发布或重新使用

例子：

• 一篇博客
• 一个论坛的帖子
• 一片新闻报道
• 用户评论

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

例子：

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

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

nav标签：表示页面的导航，可以通过导航链接到网站的其他页面，或当前页面的其他部分。

 

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

例子：

• 页面的侧边栏
• 广告
• 友情链接
• 文章引语（内容摘要）

 

section标签：一个主题性的内容分组，通常包含一个头部（header），可以还会有一个尾部（footer）。他与div非常相似，div比他更高级。

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

figure标签：显示图片

figcaption标签：显示标题        合起来就是带有标题的图片或者视频等

time标签：表示一个日期，或一个时间，或者同时表示一个日期和时间值。

　　time标签中有一个重要的属性，datatime：这里是一个固定格式的日期或时间值，可以被搜索引擎，屏幕阅读器等方便识别。

• 指定年月日：2018-10-04

• 指定年月：2018-10

• 年份可以是两位数字：18-10-04

• 指定时间（24小时）：14：33：09

• 指定日期和时间：2018-10-04 13：38：44

i和b标签i

　　html4：修饰文字样式，将文字显示为斜体文本。

　　html5：表示强调不同的情绪或声音，也可以表示技术术语，生物分类，来自另一种语言的成语或习俗，一个想法等等。

i和b标签b

　　html4：修饰文字样式的，将文字显示为粗体文本

　　html5：表示文档中的关键字，商品名称等

 

em或strong标签em

• 　　emphasis：强调。

• 　　标签中的内容是用来强调的重点内容

• 　　会被浏览器显示成斜体文本。

em或strong标签strong

• 　　表示非常重要，严重性或内容紧迫性

• 　　会被浏览器显示为粗体文本

使用建议：

 　如果你只是想单纯的想把文字的样式显示为粗体或斜体文

本，请不要使用这几种语义标签，W3C建议我们要在Css样式表中定义文字的样式。