把行内（inline）元素放到块（block）元素中

给所有的行内元素加上块级的父元素，并在段落中删除所有的块级元素。

Do you likethis picture?<br />

<imgsrc="file.gif" alt="Goose" width="100"height="100" />

I think it'sreally <em>neat</em>.<br />

-->

<p>Doyou like this picture?</p>

<div>

<imgsrc="file.gif" alt="Goose" width="100"height="100" />

 </div>

<p>Ithink it's really <em>neat</em>.</p>

 

浏览器和其他程序处理XHTML需要依赖元素间的正确位置，比如li元素必须在ul或ol中，或者ul或ol元素中必须包含至少一个li子元素；blockquote可以包含段落元素，但段落元素不能包含blockquote。

尽管浏览器可以显示违反结构规则的文档，但解析结果可能会大相径庭。而这类错误也会严重干扰编辑器或其他试图处理HTML的非浏览器工具。比如，WordPress以意想不到的方式重写标记，驶入修复blockquote跟段落的嵌套问题。

在找不到一起的段落或块级元素时，浏览器和其他工具会猜测它们应该如何处理插入的额外内容来修复。但它们的猜测并不总是正确的，并且不能保持一致。这会导致跨浏览器的CSS和JavaScript出现问题。正确嵌套元素有助于浏览器和工具处理文档的一致性。

 

HTML页面的主体部分包含以下几类元素和文本：

段落：

p和pre

块级元素：

address、blockquote、center、dir、div、dl、fieldset、form、h1、h2、h3、h4、h5、h6、hr、

noscript、ol、table、ul

行内元素：

a、abbr、acronym、b、bdo、br、cite、code、dfn、em、img、input、label、q、samp、select、

span、strong、sub、sup、textarea、var

杂项元素：

button、del、iframe、ins、map、object、script

取决于上下文的元素：li、dt、dd、tr、th、td、tbody、input、select

原始文本，也称为PCDATA

 

block元素的特点：

总是另起一行开始；

高度，行高以及顶、底边距都可控制；

宽度缺省是它所在容器的100%，除非设定一个宽度。

块元素表现为一个从前后元素中分离出来的显著部分。在视觉呈现上，这种分离通常会使硬换行的形式。在严格型XHTML中，页面的主体部分只能包含块级元素。

大多数块元素可以嵌套，也就是说，一个块元素能包含另外一个块元素。但有两个例外需要注意：p和pre。

p元素表现问段落。但跟随其他元素不同，p不可以包含另外一个p元素或其他例如blockquote等块元素。它只能包含纯文本或其他行内元素，从某种意义上说，它是一个很低级的块元素。

pre元素也是如此，它只能包含行内元素，而不是其他块元素。

 

inline元素的特点：

和其它元素都在一行上；

高度，行高以及顶、底边距不可改变；

宽度就是它所容纳的文字或图片的宽度，不可改变。

行内元素如span，strong，img和a可以包含在块内。在过渡型XHTML中，这种快可能是隐式的，但在严格型XHTML中它必须是显示的块级元素。行内元素通常可以包含其他行内元素，但不可以包含块元素。行内元素可能会夸行，但只要当前行还有地方，它们就不能换行。

 

一些杂项元素例如object和ins既可以当做行内元素也可以当做块元素使用，但如果它们作为行内元素使用，则不能包含块元素。

 

一些上下文相关的元素只能出现在相应的父元素内。例如li元素必须是ul或ol的子元素，而在其他任何地方是无效的。td元素必须是tr元素的子元素，而tr又必须是table或者tbody元素的子元素。这些元素不能再它们定义的父元素之外出现。