<p>在语义上通常用于文本，段落。

<div>用于网页中的块或区域。例如，它可以用来制作标题的区域。

它们可能可以互换使用，但你不应该这样做。

<p>在语义上通常用于文本，段落。

<div>用于网页中的块或区域。例如，它可以用来制作标题的区域。

它们可能可以互换使用，但你不应该这样做。

<p>代表一个段落，<div>代表一个“分割”，我认为主要的区别是div在语义上是“无意义的”，其中<p>应该代表与文本本身有关的东西。

例如，你不会想要有嵌套的<p>s，因为这不会有太多的语义意义(除了在引用的意义上)，而人们使用嵌套的<div>s进行页面布局。

根据维基百科

在HTML中，span和div元素是 用于文档的某些部分不能使用的地方 被他人从语义上描述 HTML元素。

DIV是一个通用的块级容器，它可以包含任何其他块或内联元素，包括其他DIV元素，而P用于段落(文本)的换行。

之前的代码是

<p class='item'><span class='name'>*Scrambled eggs on crusty Italian ciabatta and bruschetta tomato</span><span class='price'>$12.50</span></p>

所以我要把它改成

<div class='item'><span class='name'>*Scrambled eggs on crusty Italian ciabatta and bruschetta tomato</span><span class='price'>$12.50</span></div>

这很容易解决。上面代码的CSS是

.item {
    position: relative;
    border: 1px solid green;
    height: 30px;
}

.item .name {
    position: absolute;
    top: 0px;
    left: 0px;
}

.item .price {
    position: absolute;
    right: 0px;
    bottom: 0px;
}

所以div标签可以包含其他元素。P不应该被强迫这么做。

这些都是很好的答案，但有一个区别我还没有看到提到，那就是浏览器默认呈现它们的方式。主要的web浏览器会在段落的上方和下方显示一个<p>标签。<div>标记将被呈现，完全没有任何边距。