样式方面或填充/边距元素

Question

现在使用HTML5和CSS3，当可以使用margin/padding时，使用<br>标签是否被视为不推荐的呢？

编辑：这与我使用情况下的div元素之间的间距有关，但通用的最佳实践建议也是受欢迎的。

- thatidiotguy

---

我通常建议不要使用<br>标签。 - Shmiddty

如果这不仅仅是样式上的问题（例如思想分离），您可能正在寻找<hr>，并进行自定义样式设置（透明，使用height或margin来控制间距）。 - 0b10011

Answer 1

实际上 <BR> 的使用有明确的规则，最初可以追溯到HTML 2.0时代:

<BR>元素指定了单词之间的换行（请参见第6节“字符、单词和段落”）。例如：

<P> Pease porridge hot<BR>
Pease porridge cold<BR>
Pease porridge in the pot<BR>
Nine days old.

<br>元素本身从未被设计用于控制边距/填充。虽然在HTML 3.2中引入了一个表示性的clear属性来处理诸如浮动图像之类的事情，但它很快在HTML 4和XHTML 1中被弃用，以支持CSS。那已经是将近15年前的事情了，所以这并不是什么新鲜事。

在HTML5中，他们更加明确地指出了<br>不适用于表示或布局，并提供了示例（以及过时的clear属性）：

br元素只能用于实际上是内容的一部分的换行符，例如诗歌或地址。

以下示例是br元素的正确用法：

<p>P. Sherman<br>
42 Wallaby Way<br>
Sydney</p>

br元素不能用于分隔段落中的主题组。

以下示例是不符合规范的，因为它们滥用了br元素：

<p><a ...>34 comments.</a><br>
<a ...>Add a comment.</a></p>
<p><label>Name: <input name="name"></label><br>
<label>Address: <input name="address"></label></p>

以下是替代上述方法的正确方式：

<p><a ...>34 comments.</a></p>
<p><a ...>Add a comment.</a></p>

<p><label>Name: <input name="name"></label></p>
<p><label>Address: <input name="address"></label></p>

使用 <br> 代替 CSS margin 进行布局一直被规范的作者所不赞同。

- BoltClock

---

HTML 5的规范比语言参考更加详尽，其中指出：br元素只应该用于内容中真正需要换行的地方，例如诗歌或地址等。 - Quentin

@Quentin：感谢提供链接。由于某些原因，HTML5规范对我来说一直是一个导航噩梦，我无法找到那个部分。我会更新我的答案。 - BoltClock

使用 <br/> 对我来说更简单、更清晰。有人能解释一下它可能会带来什么不利影响吗？ - Jeff Zivkovic

@Jeff Zivkovic：众所周知，使用CSS样式来控制br标签很麻烦。即使您不直接为其设置样式，也无法控制br标签所创建的空间量，因为br标签本身就是一个行高单位大小。正如我在答案中提到的那样，这种做法从语义上讲是不合适的，无论它看起来多么简单和清晰。这就像使用表格进行布局一样-它看起来很好，但实际上您并没有一个表格。 - BoltClock

好的。那很有道理。 - Jeff Zivkovic

Answer 2

这取决于你喜欢使用行高还是边距/填充。

- Jordan Denison

---

如果你使用行高来达到类似于外边距的效果，那么你可能做错了。 - Ryan Kinal