事实再一次证明了,选一本好的书是多么的重要啊!弃掉一开始的坑,换一本书来继续我们的学习吧。
(1) 结构化构建块
div: 这是我们都知道且喜爱的一种一般性容器。它是一种无附加语义含义的流式内容元素。
section: 这是文档或应用程序的一般性小节。
article: 这是文档或网站的一个独立的小节。
听起来十分的相似对吧?确实。但是我们区分一下:
div是没有任何的语义的,比如<div class="nav">和<div class="mick">本质上对浏览器解析来说没有任何区别。
section元素类似于div,这是一个一般性容器元素,但他有一个附加语义——它包含的东西是一组逻辑相关的内容。它也是一种内容的分节元素。
article是一种特殊的section,即它是页面的一个独立的、自包含的部分。
怎么选择?
1. 如果被封装的内容在馈送阅读器中会由完整的意义吗?是,那么article。
2. 被封装的内容是相关的?是,那么用section。
3. 如果没有语义关系,那么用div。
(2) 标题
header: 用于分节元素的内容介绍和导航。
footer: 用于表现内容的附加信息,如作者、相关文档的链接等,通常出现在内容的底部。
hgroup: 是header的一种特殊形式,它只能包含<h1>~<h6>元素,用于带有副标题的标题进行组合。
<h1>~<h6>: 没有什么改变的地方。
(3) 更多的结构化元素
nav: 导航链接小节,这些链接或是链接到其他页面的,或是链接到同一页面的其他小节。
aside: 页面的一个小节,由与周边内容略微相关但又单独分开的内容所组成。
figure: 用于这样一种内容:对理解至关重要,但可以在文档流中迁移,而不影响文档的含义。这可以用于图像或视频,也可以用于任何其他内容,包括图表、代码示例或其他媒体。