article
<article> 标签定义独立的内容
<!DOCTYPE html><html> ???<head> ???????<meta charset="UTF-8"> ???????<title></title> ???</head> ???<body> ???????<div>article标签</div> ???????<article> ???????????<h1>Internet Explorer 9</h1> ???????????<p>Windows Internet Explorer 9（简称 IE9）于 2011 年 3 月 14 日发布.....</p> ???????</article> ???</body></html>
aside
<aside> 标签定义 <article> 标签外的内容，aside 的内容应该与附近的内容相关
<!DOCTYPE html><html> ???<head> ???????<meta charset="UTF-8"> ???????<title></title> ???</head> ???<body> ???????<p>My family and I visited The Epcot center this summer.</p> ???????<aside> ???????????<h4>Epcot Center</h4> ???????????<p>The Epcot Center is a theme park in Disney World, Florida.</p> ???????</aside> ???</body></html>
figure
<figure> 标签规定独立的流内容（图像、图表、照片、代码等等），figure 元素的内容应该与主内容相关，但如果被删除，则不应对文档流产生影响
<!DOCTYPE html><html> ???<head> ???????<meta charset="UTF-8"> ???????<title></title> ???</head> ???<body> ???????<p>上海卢浦大桥是当今世界第一钢结构拱桥，是世界上跨度最大的拱形桥。</p> ???????<figure> ???????????<p>黄浦江上的的卢浦大桥</p> ???????????<p>拍摄者：W3School 项目组，拍摄时间：2010 年 10 月</p> ???????????<img src="img/bridge.jpg" width="350" height="250" /> ???????</figure> ???</body></html>
nav
<nav> 标签定义导航链接的部分
<!DOCTYPE html><html> ???<head> ???????<meta charset="UTF-8"> ???????<title></title> ???</head> ???<body> ???????<nav> ???????????<a href="#">Java</a> ???????????<a href="#">C#</a> ???????????<a href="#">JavaScript</a> ???????</nav> ???</body></html>
section
<section> 标签定义文档中的节（section、区段）。比如章节、页眉、页脚或文档中的其他部分
<!DOCTYPE html><html> ???<head> ???????<meta charset="UTF-8"> ???????<title></title> ???</head> ???<body> ???????<section> ???????????<h1>Java</h1> ???????????<p> ???????????????Java是一门语言! ???????????</p> ???????</section> ???????<section> ???????????<h1>C#</h1> ???????????<p> ???????????????C#是一门语言！ ???????????</p> ???????</section> ???????<p> ???????????C#是一门语言！ ???????</p> ???</body></html>
HTML标签-----article、aside、figure、nav和section
原文地址：https://www.cnblogs.com/fengfuwanliu/p/10221199.html