HTML tags 可包含关系问题

昨天提交xhtml assignment的时候被问到标签p和标签div之间嵌套关系问题,简短地说,为什么这样是对的:

而这样是错的:

起先一直找不到为什么,网上也没有什么文章,后来在stackoverflow问了问题,也向人人的好友问了,于是得到了解答。

首先从现象来看,浏览器碰到第二种错误写法时,读到<div>这个标签的时候,自动会将上面的<p>标签结束。所以会被解析成如下的形式:

从原理来讲,<p>标签内不能嵌入div是由dtd规定的:

在xhtml1-transitional.dtd的时候可以发现这些语句:

这些语句意味着p里面能放%Inline类的内容,而div里面能放%Flow类型的内容(Flow包含了%inline的内容和%block型的)。
所以p里面不能放div标签。同理,所有标签里面能放哪些标签,也可以从定义里面看到。