section

http://lightcss.com/careful-with-section/#comment-103706

是什么?
其实在W3C官方文档中不难找到答案:
The section element represents a generic section of a document or application. A section, in this context, is a thematic grouping of content, typically with a heading.

看起来像是有语义版的
,但实际的使用是用在一个专题性的版块,且通常带有一个标题。适合用于章节、标签切换效果的每一个tab容器或论文中有编号的地方,也可以用于网站主页中划分简介、新闻、联系信息等板块[2]

官方还给了一个提示:
The section element is not a generic container element. When an element is needed for styling purposes or as a convenience for scripting, authors are encouraged to use the div element instead. A general rule is that the section element is appropriate only if the element’s contents would be listed explicitly in the document’s outline.

说的十分明确,

不是一个普通的容器元素,当为了样式布局时,建议使用
。当元素内容明确的列举在大纲时建议使用

我想W3C的介绍说的已经足够明确,只要谨记一点就不容易用错:
不是一个通用的纯容器标签。对这个问题我困惑了很久,因为有些HTML5教程让我迷惑,而很多大网站也是在疯狂的使用
作为容器标签。
使用

可以相互嵌套,在页面中定义了一个特殊的顶级区块,于是可以从

开始列提纲而不用担心会破坏网页的纲要。尽管没找到明确说明,但我个人认为在每一层
里还是仅使用一个

为佳。
以Wordpress主题为例,我认为与#sidebar相对的#content部分,使用
包裹一堆
作为页面的主要内容并不太合适。而使用
用在整体布局是明显错误的了。
而适合使用
标签的地方有:
文章的评论列表,有着整齐的结构;
文章内容的目录,有着文章内部结构纲要;
侧栏widget,在WebDesignWall中我看到了这样的设计,因为widget内容大都是评论列表、文章列表,有着清晰的结构且是独立完整的一部分;
包裹文章中各个章节的段落,但要在编辑器完成,目前来看并不易用。

随着标签越来越多样化,把标签用对本来就不是一件容易事,用得完全合理就更难了。好在目前这些东西用户是看不到的,产品经理也不会留意。如果没有强迫症,大可不必纠结与此。
最后我再啰嗦一次:1、不要把

那样用;2、没有section+css这个东西,严格的说div+css都是错误的说法。

你可能感兴趣的:(section)