记得两年前写页面的时候,LI、DIV等标签疯狂用,不停的嵌套。做完一些项目回头分析,逐渐发现一些嵌套上的问题。嵌套的错误可能会导致一些意想不到的页面显示问题。正关心着这事呢,JunChen Wu翻译的Allowed nesting of elements in HTML 4 Strict (and XHTML 1.0 Strict)真是及时雨,将这表打印了放在显示器旁,日久生情就把它牢记,再后来页面也基本上没出现过嵌套的问题和疑惑。
两年后的今天,和小昭同学讨论起这个问题,赶紧拿出来温习下。
非常感谢JunChen Wu的(X)HTML Strict 下的嵌套规则,也同时将文章转过来。
下面是一份在 HTML 4 Strict 和 XHTML 1.0 Strict 下必须遵守的标签嵌套规则,比如你不能在 <a>
里面再嵌入一个 <a>
这样的约定。
说明:
- 为了方便读者阅读,本文中的标签使用了大写(根据 XHTML 的规则,元素名必须小写,比如
<html>
而不应是<HTML>
) - 小写的单词表明一组或一系列 HTML 标签
- 每一项条目(标签)后都跟随一组标签列表,如果没有这个列表,那么表明该条目(标签)内部不允许包含任何标签。这意味着该条目内部只能包含纯文本 内容(#PCDATA,见下文)。如果注明 (empty),这意味着该条目内部不允许包含任何形式的内容。对于 flow,inline,block,OBJECT 和 BODY,其内部允许包含的内容在文中会单独给出。
- #PCDATA 的意思是“parsed character data”,即纯文本内容(不包括任何 HTML 标签,但是转义内容可以存在,比如
ä
和ä
) - CDATA 的意思是“character data”,这意味着不包括转义内容的纯文本内容,详细内容可以参考CDATA Confusion
- excluding … 意即不得直接或者间接的包含所列的元素