主体结构元素
主体结构元素:它是为了语义可以结构化,说白了就是为了更好地SEO,也就是为了浏览器更好地抓数据,包含的元素:article,section,nav,aside,time.
(1)article文章、文档、页面。
<article>
<header>
<h2>HTML5课程</h2>
</header>
<p>轻松学习HTML5,欢迎来到<a href="http://www.huadianedu.com">华点</a></p>
</article>
用法:一片文章、一个页面、一个独立完整的内容,这个标签强调的是内容的独立性,同时,一般article元素里面会嵌套一个header标签。
(2)section
section的意思是段落,章节,通常由标题和内容组成。该标签的特点是:强调分段分块
<article>
<h1>苹果</h1>
<p>苹果是一种可以吃的水果,大家都喜欢吃</p>
<section>
<h3>红富士</h3>
<p>是一个红色的苹果</p>
</section>
<section>
<h3>国光</h3>
<p>是一种带有酸性的苹果</p>
</section>
</article>
(3)nav
导航,navigation的缩写,通常用在:导航条,页面导航,翻页操作等。
<header>
<div class="logo"></div>
<nav>
<ul>
<li>H5发展史</li>
<li>CSS发展史</li>
<li>EMScript发展史</li>
</ul>
</nav>
</header>
(4)aside
意为旁边、侧旁。
通常的用法:放在article里面,作为附属信息部分比如参考信息,名称解释。放在article外面,作为整个页面的附属信息,比如侧边栏,友情链接,广告区域。
<article>
<h1>马云是谁</h1>
<p>马云,男,1964年9月10日生于浙江省杭州市,祖籍浙江省嵊州市(原嵊县)谷来镇,
阿里巴巴集团主要创始人,现担任阿里巴巴集团董事局主席、日本软银董事、
大自然保护协会中国理事会主席兼全球董事会成员、华谊兄弟董事、生命科学突破奖基金会董事。</p>
<aside>
<h1>参考资料</h1>
<p>百度百科</p>
</aside>
</article>
<aside>
<nav>
<ul>
<li><a href="">张三博客</a></li>
<li><a href="">李四博客</a></li>
<li><a href="">王五博客</a></li>
<li><a href="">赵六博客</a></li>
</ul>
</nav>
</aside>
(5)time
时间标签,用法:表示24小时的某个时刻或者某个日期。
注:该标签所有浏览器都不支持。
(1)header标签
一般用来放置整个页面的标题,比如说一个新闻页面,header一般放新闻的标题,如果是一个官方网址,一般header用来放logo和网站导航。
(2)footer标签
一般用来放置脚注,主要包含:作者信息、copyright。
(3)address标签
一般用来呈现联系信息,主要包括:网站的联系方式,电子邮箱,地址