【问题标题】:When to use <p> vs. <br> [closed]何时使用 <p> 与 <br> [关闭]
【发布时间】:2012-12-03 17:03:58
【问题描述】:

什么时候应该使用另一个&lt;p&gt;...&lt;/p&gt; 而不是&lt;br /&gt; 标签?这种事情的最佳做法是什么?

我四处寻找这个问题,但大部分文章似乎有点陈旧,所以我不确定从那以后关于这个主题的意见是否有所发展。

编辑:为了澄清这个问题,这是我正在处理的情况。您会使用&lt;br&gt;'s 还是&lt;p&gt;'s 来处理以下内容(假设它包含在主页的一个div 中):


欢迎来到首页。

看看我们的东西。

你真的应该。


现在,这些行在技术上并不是“段落”。那么你会通过将整个块包围在&lt;p&gt; 标记中并在其间使用&lt;br&gt; 来标记这一点,还是为每一行使用单独的&lt;p&gt;

【问题讨论】:

    标签: html


    【解决方案1】:

    它们有两种不同的功能。

    &lt;p&gt;(段落)是一个块元素,用于保存文本。 &lt;br /&gt; 用于在 &lt;p&gt; 元素内强制换行。

    示例

    <p>Suspendisse sodales odio in felis sagittis hendrerit. Donec tempus laoreet
    est bibendum sollicitudin. Etiam tristique convallis<br />rutrum. Phasellus 
    id mi neque. Vivamus gravida aliquam condimentum.</p>
    

    结果

    felis sagittis hendrerit 中的 Suspendisse sodales odio。 Donec tempus laoreet est bibendum sollicitudin。 Etiam tristique convallis
    rutrum。菜豆 我是内克。 Vivamus gravida aliquam condimentum。

    更新

    基于新的要求,我个人会使用&lt;p&gt; 来实现间距以及允许样式。如果将来您希望为这些部分之一设置样式,那么在块级别这样做会容易得多。

    <p>Welcome to the home page.</p>
    
    <p style="border: 1px solid #00ff00;">Check out our stuff.</p>
    
    <p>You really should.</p>
    

    【讨论】:

    • 这个答案是有道理的。但是,您能否回复我添加的示例(请参阅问题中的编辑),并解释您的思考过程?
    【解决方案2】:

    当您需要将两个信息流分解为不同的想法时,您希望使用&lt;p&gt; 标签。

    <p> Now is the time for all good men to come to the aid of their country. </p>
    
    <p>The quick brown fox jumped over the lazy sleeping dog.</p>
    

    &lt;br/&gt; 标签用作网页文本流中的强制换行符。当您希望文本在下一行继续时使用它,例如诗歌。

    <p>  Now is the time for all good men to come to the aid of their country. <br/>
    The quick brown fox jumped over the lazy sleeping dog. </p>
    

    source

    【讨论】:

      【解决方案3】:

      我在回答这个帖子中的问题时可能违反了礼仪规则——因为到目前为止大多数答案都很好——但我是这样处理这个论点的:

      虽然我同意“p”是用于保存文本的元素,而“br”标签用于中断文本,但在许多情况下,人们可能想要操作具有实际行间距的文本“块”他们之间;

      例如:
      [我的文字块]
      世界你好!
      --------这是一个空行------
      你真有生命力!
      [/我的文本块]

      现在很多人会争辩说,你可以在一个 'div' 中放置两个 'p' 元素,然后操纵那个 'div',但是我觉得这更耗时(也就是我很懒),因此我坚持使用双 'br' 方法——让我只操作那个 'p'。

      我的非正统方法的问题是,如果对行高应用了特定的样式,那么双“br”与“p”创建的行间距肯定会有明显的差异。

      我猜在决定采用哪种技术时,请考虑:

      • 代码可读性
      • 最佳实践
      • 时间
      • 快捷方式对其余代码的影响

      【讨论】:

      【解决方案4】:

      当你想分隔两个段落时,你应该使用&lt;p&gt;。来自维基百科:

      段落(来自希腊语paragraphos,“写在旁边”或“写在 beside") 是书面交易中的一个独立的话语单元 有一个特定的观点或想法。

      如果您想在段落中强制换行,请使用 &lt;br&gt; 标签。

      【讨论】:

        【解决方案5】:

        除非您打算将内容放入其中,否则我不会使用&lt;p&gt;。当然,这只是一种观点(我认为大多数答案都是如此)。

        但是,设置&lt;p&gt; 标签的样式可能更容易(至少有更多选项),这可能有助于更频繁地使用。我唯一的问题是这不是很容易阅读(在阅读代码时),而且我觉得这些样式可以应用于其他地方(可能应用于 &lt;p&gt; 标签周围的标签。

        另外,正如其他人所说,&lt;br /&gt; 标签应该用于分隔块元素中的内容(例如&lt;p&gt; 标签)。如果您正在使用以下内容:

        <p class="a">some content...</p>
        <p class="break"></p>
        <p class="b">some other content...</p>
        

        那么我认为您应该在p.break 标签周围的一个或两个标签上使用样式来执行任何所需的间距

        【讨论】:

        • 只需使用边距添加空间。空 p 没有意义。
        • @elhoucine - 是的,这就是我要提出的观点。
        【解决方案6】:

        p 标签是块级元素,主要用于添加内容,而br 标签用于在元素内强制换行。也就是说,如果您要遵循语义。现在很多人都这样做是为了给标签和诸如此类的东西添加特定的含义。我希望这会有所帮助。不过,祝你好运。 =)

        【讨论】:

        • -1 这不会添加到已在此处发布的任何答案。
        猜你喜欢
        • 2011-07-14
        • 2020-06-01
        • 1970-01-01
        • 2015-06-16
        • 2011-12-05
        • 2013-01-31
        • 2016-09-08
        • 2018-08-14
        • 2015-11-28
        相关资源
        最近更新 更多