我应该将段落视为文本还是文本块（理论）？

Question

今天拿到一个作品，看到paragraphs格式有点奇怪<p></p>.

#product p { 
    float: left;
    width: 513px;
}

HTML 是：
观察：
- 每张图片都有270px，永远不会更多

<div id='product'>
    <h1>Product name</h1>
    <div class='img-product'>
        <img src='http://fakeimg.pl/270x270/' />
    </div>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede.</p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede.</p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede.</p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede.</p>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede.</p>           
</div>

这个 html/css 的结果是页面左侧有 270px 宽度的图像，右侧有一个空白区域。

• 要点：https://gist.github.com/6549722/8321ac9097cfd4b0ad127e3f74fa86370119f43a
• html/css:http://dabblet.com/gist/6549722

我的问题是

只有理论，没有实践（我知道如何解决这个问题，我只是想知道使用标签“p”是否只是针对文本，即它不应该用作块）。

正确的做法是创建一个 div，例如“描述”，并格式化它们（如定位和大小），而不是应用段落格式这样的？在 99% 的时间里，瞄准的只是文本。

我从未见过有人像 div 那样格式化段落，或者，我知道，是在极其特殊的情况下。因为，对我来说，段落是一个文本元素，仅此而已，所以，样式是针对字体、颜色、行高等的。

对不起我的英语

Answer 1

W3C 推荐 HTML 4.01 Specification 说：

9.3.1 Paragraphs: the P element

P 元素代表一个段落。

7.5.4 Grouping elements: the DIV and SPAN elements

DIV 和 SPAN 元素，连同 id 和 class 属性，提供一个通用机制来添加结构 文件。这些元素将内容定义为内联 (SPAN) 或 块级（DIV），但没有在 内容。因此，作者可以将这些元素与 样式表、lang 属性等，为自己定制 HTML 需求和品味。

例如，假设我们想要生成一个 HTML 文档 基于客户信息数据库。由于 HTML 不包含 标识对象的元素，例如“客户”、“电话号码”、 “email address”等，我们使用DIV和SPAN来实现想要的 结构和表现效果。

如果您有一个实际的段落，请使用P，但如果您正在构建不是段落的内容，请使用DIV 或SPAN。选择使用哪个元素是语义的，应该基于内容。样式的选择是正交的，真的。您可以随意设置段落或分区的样式；它们都是块级元素。

您确实提出了一个有趣的观点，即尝试保留特定于文本的段落样式，而不是文档格式，但这只有在您已经拥有段落所在的更高级别的划分时才有可能。如果你不这样做，那将不是一个选择。我个人更喜欢更简单的结构而不是更复杂的结构，所以如果我的段落足够并且不需要在更高级别的分区中，我只需将样式放在段落上，而不是将它们包装在分区中。

Answer 2

您需要将包含图像的 div 浮动到左侧。 DIV 是块级元素，除非浮动，否则不允许任何其他元素靠近它。

.img-product{
    float:left;
}

Answer 3

试试

#product p { 
    float: left;
    width: 513px;
    padding:0px;
    margin:0px;
}