html要求标记严格嵌套,HTML教程XHTML教程HTML标记嵌套使用技巧.docx

工作总结,调研报告,实施方案,管理制度,汇报材料

部分文献资料来源于网络,仅供个人参考试阅,版权归原作者,若有侵犯，敬请及时告知！

每个人都有自己的活法，没必要去复制别人的生活。有的人表面风光，暗地里却不知流了多少眼泪。有的人看似生活窘迫，实际上却过得潇洒快活。幸福没有标准答案，快乐也不止一条道路。收回羡慕别人的目光，反观自己的内心。自己喜欢的日子，就是最好的日子。自己喜欢的活法，就是最好的活法。

每个人都有自己的活法，没必要去复制别人的生活。有的人表面风光，暗地里却不知流了多少眼泪。有的人看似生活窘迫，实际上却过得潇洒快活。幸福没有标准答案，快乐也不止一条道路。收回羡慕别人的目光，反观自己的内心。自己喜欢的日子，就是最好的日子。自己喜欢的活法，就是最好的活法。

先来看以下这样一段代码：

???

?

当然，我是不会告诉你这段代码来自于FACEBOOK的 ，各位认为以上元素的嵌套有没有问题呢？我们会在后面讨论这个。

HTML4/XHTML的嵌套规则

在我们的印象中会有这样的嵌套规则：

内联元素不能嵌套块元素

元素和

元素不能嵌套块元素

那么到底什么是块元素，什么是内联元素？

以下是W3C?CSS2.1规范中对块元素和内联元素的定义：

Block-level elements?are those elements of the source document that are formatted visually as blocks (e.g., paragraphs). The following values of the ‘display’??property make an element block-level: ‘block’, ‘list-item’, and ‘table’.

Inline-level elements?are those elements of the source document that do not form new blocks of content; the content is distributed in lines (e.g., emphasized pieces of text within a paragraph, inline images, etc.). The following values of the?‘display’?property make an element inline-level: ‘inline’, ‘inline-table’, and ‘inline-block’. Inline-level elements generate?inline-level boxes, which are boxes that participate in an inline formatting context.

我们可以这样理解：块元素一般都从新行开始，内联元素在一行内显示，我们也可以通过CSS属性display的’inline’ 或 ‘ block’ 来改变元素为内联元素或块元素，当然这是CSS中对元素的分类，显然用 ‘display’ 的属性值来对html元素进行分类是不严谨的。

如果按照上述规则来讲，那么FACEBOOK的做法就是一种错误的做法，因为他在内联元素元素中嵌套了块元素元素

，但是细心的读者应该会发现上述规则是基于HTML4/xHTML1的strict模式，而FACEBOOK现在已经统一使用了html5的doctype，那么这个规则到底还是是否适用？

HTML5的元素嵌套规则

元素的嵌套规则和页面头部申明的DTD有着千丝万缕的关系，DTD基础请查看我之前写的文章《DTD详解》，那么在最新的HTML5规范中是否对元素嵌套有着新的规范呢？

让我们先了解下W3C在最新的HTML5规范中对元素的分类方式：

如上图，元素的分类不再是块元素或内联元素这样来分类(其实从来就没有这样分)，而是按照如下分类来分：Flow(流式元素)、Heading(标题元素)、Sectioning(章节元素)、Phrasing(段落元素)、Embedded(嵌入元素)、Interactive(交互元素)、Metadata(元数据元素)。

Flow(流式元素)

在应用程序和文档的主体部分中使用的大部分元素都被分类为流式元素。

a，?abbr，?address