当每行写一个句子并希望行与行之间留出空间但有一个语义段落时,我应该使用 <br> 还是 <p>?

When writing one sentence per line and wanting space between lines but one semantic paragraph, should I use <br> or <p>?

提问人:syrinj 提问时间:11/8/2023 最后编辑:Darryl Noakessyrinj 更新时间:11/8/2023 访问量:47

问:

我正在以这种风格在销售页面上写长篇文案(为简洁起见,缩短):

我们明白了......

找到一个理解 X 的 X 是很困难的。

似乎他们都是X。

那么,你应该如何决定呢?

这是一个沉重的问题,但我们可以告诉你的是:

我应该使用双 <br/> 标签将其保留在单个语义段落中,还是应该只为每一行使用 <p> 标签,即使它们是同一思想的一部分?

最初我是这样写的:

<p>
  We get it..
  <br/><br/>
  Finding an X that understand X is difficult.
  <br/><br/>
  It seems like they all X.
  <br/><br/>
  So, how are you supposed to decide?
  <br/><br/>
  That's a loaded question, but what we can tell you is this:
</p>

我的思考过程是,这一切都应该是一个想法的一部分,我试图在语义和可访问性方面保持头脑清醒。

问题是,对我来说,使用两个标签来创建空间是不可取的,并且根据我在这里看到的其他线程,可能在语义上不正确。这不是诗歌或邮寄地址,不。但这是一个单一的想法。<br/>

然后我尝试使用单个标签,然后去设置它的样式,却发现我不能。<br/>

因此,我决定将每一行都包裹在自己的标签中(更容易使用CSS设置空间样式)。<p>

<p>We get it..</p>
<p>Finding an X that understand X is difficult.</p>
<p>It seems like they all X.</p>
<p>So, how are you supposed to decide?</p>
<p>That's a loaded question, but what we can tell you is this:</p>

但我仍然不确定这是否是语义和可访问性的问题。

就我而言,哪种方法是正确的?

HTML CSS 可访问性 语义标记

评论

4赞 Temani Afif 11/8/2023
两者都很好,但你没有义务使用双<br>,你总是可以使用CSS增加行之间的间距,只保留一个<br>

答:

1赞 Darryl Noakes 11/8/2023 #1

MDN 说道:

HTML 元素在文本中生成换行符(回车)。它对于写一首诗或一个地址很有用,其中行的划分很重要。 [强调我的]<br>

虽然不是一首诗或演讲,但行的划分很重要。 你发现的反对它的论点很可能是反对滥用它,它被用来创建段落。这里的情况并非如此,所以我认为使用它没有任何问题。

但是,您不需要多个。这就是样式/CSS 的用武之地。你不能真正设置一个 的样式,但它会创建一个换行符,你可以设置线条的样式。具体来说,您可以使用以下项间距:<br>line-height

p {
  line-height: 2em;
}
<p>
  We get it…<br>
  Finding an X that understands X is difficult.<br>
  It seems like they all X.<br>
  So, how are you supposed to decide?<br>
  That's a loaded question, but what we can tell you is this:<br>
</p>

请注意,自然换行符也会导致此间距,因此,如果出现问题,可能需要使用多个换行符。


我现在明白了,@TemaniAfif已经对此发表了评论

评论

0赞 syrinj 11/8/2023
谢谢你,@TemaniAfif俩,太完美了!
0赞 Darryl Noakes 11/8/2023
友情提示,因为您似乎是这里的新手(基于您的代表):如果答案回答了您的问题,您可以通过单击顶部附近左侧的灰色复选标记来接受它。如果您认为这是一个好的答案,请投赞成票。(虽然可能有 15 次代表限制?现在不记得了。