html1和html2之间只有一个区别。
与html1相比，html2中只有7个字符（即一对符号：<p><>/p>）。
对于html1：
<html>
<style type="text/css">
#content{
width:873px;
height:400px;
border:1px solid green;
}
#content_left{
float:left;
width:398px;
height:300px;
border:1px solid red;
}
#content_right{
float:left;
width:471px;
height:300px;
border:1px solid red;
}
</style>
<body>
<div id="content">i am here
<div id="content_left">content_left
</div>
<div id="content_right">content_right
</div>
</div>
</body>
</html>
html1在firefox中解析如下。
对于html2：
<html>
<style type="text/css">
#content{
width:873px;
height:400px;
border:1px solid green;
}
#content_left{
float:left;
width:398px;
height:300px;
border:1px solid red;
}
#content_right{
float:left;
width:471px;
height:300px;
border:1px solid red;
}
</style>
<body>
<div id="content"><p>i am here</p>
<div id="content_left">content_left
</div>
<div id="content_right">content_right
</div>
</div>
</body>
</html>
html2在Firefox中解析如下。
现在很明显，对于html2：
1.div内容包含三个子元素：lable，其中包含文本
i am here，div content_left，content_right。它们在结构上是parent_son关系。2.pable和content_left和content_right是结构上的兄弟关系。
很明显html2是由firefox解析的。
让我们分析html1，对于文本
i am here不可用。firefox解析
i am here文本是什么？i am here与content_left和content_right之间是什么关系？为什么Firefox会以这种方式解析html1？
最佳答案
没有p标签的文本被视为display:inline。如果添加<p> .. </p>，则为display:block。因此，其行为类似于图像中的行为。
如果将display:inline添加到p，它将与第一个html相同。
p {
display: inline;
}
Fiddle with
display:inline in p