Question

我不断找到需要使用<br />标签的地方，因为CSS无法满足我的需求。 <br />不是“设计”的一部分而不是文档结构的一部分吗？它的可接受用途是什么？相同的规则是否也适用于<hr />？

以下是我感到被迫使用<br />标记的示例：

我想要显示：

<address>1234 south east Main St. Somewhere, Id 54555</address>

像这样：

1234 south east main st.
Somewhere, Id 54555

Answer 1

使用＆lt; br /＆gt;没有任何问题或者＆lt; hr /＆gt;。即使在新的HTML 5草案规范（相关spec info）中，它们都不是已弃用的标记。实际上，很难说明＆lt; br /＆gt;的正确用法。标签比W3C本身更好：

以下示例正确使用了br元素：

＆LT; p为H. P上。谢尔曼＆LT峰; br＆GT;
    42 Wallaby Way＆lt; br＆gt;
    悉尼＆LT; / p为H.

br元素不得用于分隔段落中的专题组。

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

＆lt; p＆gt;＆lt; a ...＆gt; 34条评论。＆lt; / a＆gt;＆lt; br＆gt;
    ＆lt; a ...＆gt;添加评论。＆lt; a＆gt;＆lt; / p＆gt;

＆lt; p＆gt;名称：＆lt;输入名称=“名称”＆gt;＆lt; br＆gt;
    地址：＆lt; input name =“address”＆gt;＆lt; / p＆gt;

以上是上述选项的替代方法：

＆lt; p＆gt;＆lt; a ...＆gt; 34条评论。＆lt; / a＆gt;＆lt; / p＆gt;
    ＆lt; p＆gt;＆lt; a ...＆gt;添加评论。＆lt; a＆gt;＆lt; / p＆gt;

＆lt; p＆gt;名称：＆lt;输入名称=“名称”＆gt;＆lt; / p＆gt;
    ＆lt; p＆gt;地址：＆lt;输入名称=“地址”＆gt;＆lt; / p＆gt;

＆lt; hr /＆gt;很可能也是内容的一部分，而不仅仅是一个显示元素。当涉及什么是内容和什么不是内容时，请使用良好的判断，并且您将知道何时使用这些元素。它们在当前的W3C规范中都是有效的，有用的元素。但是，强大的力量带来了巨大的责任，所以正确使用它们。

编辑1：

我第一次点击“帖子”后的另一个想法 - 有很多反对＆lt; table＆gt;近年来网络开发人员的情绪，并有充分的理由。人们滥用＆lt; table＆gt;标记，用于站点布局和格式化。这不是它的用途，所以你不应该这样使用它。但这是否意味着你应该从不使用＆lt; table＆gt;标签？如果您的代码中确实有一个诚实的表格，例如，如果您正在撰写科学文章并且想要包含the periodic table of the elements，该怎么办？在这种情况下，使用＆lt; table＆gt;完全合理，它变成语义标记而不是格式化。这与＆lt; br /＆gt;的情况相同。当它是你的内容的一部分（即，为了正确的英语而应该在那些点打破的文本），使用它！当你出于格式化原因而这样做时，最好尝试另一种方式。

Answer 2

只要您不使用＆lt; br /＆gt;形成段落，你可能在我的书中没问题;）我讨厌看到：

<p>
  ...lengthy first paragraph...
  <br/>
  <br/>
  ...lengthy second paragraph...
  <br/>
  <br/>
  ...lengthy third paragraph...
</p>

至于地址，我会这样做：

<address class="address">
  <span class="street">1100 N. Wullabee Lane</span><br/>
  <span class="city">Pensacola</span>, <span class="state">Florida</span> 
  <span class="zip">32503</span>
</address>

但这可能是因为我喜欢jQuery，并希望在任何特定时刻访问任何这些部分：）

Answer 3

就我个人而言，我认为除了使用这两个标签之外，你可以做的事情要糟糕得多。过度担心他们是浪费时间。

Answer 4

<hr />和<br />，就像其他一切一样，可以在不应该被设计时被滥用。 <hr />用于在视觉上划分文本部分，但在本地化意义上。 <br />意味着做同样的事情，但没有水平线。

在网站上使用<hr />作为设计是一个设计缺陷，但在这篇文章中，使用<br />和<hr />都是正确的，因为这部分文本仍然必须是文本的一部分，即使网站布局发生了变化。

Answer 5

<hr/>和<br/>是对文档没有语义价值的表示元素，因此从纯粹主义的角度来看，应该避免使用它们。

将HTML视为表示工具，而不是将其作为需要自我描述的文档。 <hr/>和<br/>不添加语义值 - 而是代表浏览器中非常具体的表示。

所有人都说，在你的方法中务实。尽量不惜一切代价避免它们，但是如果你发现自己编码墙壁和天花板以避免它们，那么最好继续使用它们。语义很重要，但像这样的边缘情况并不是它们最重要的地方。

Answer 6

我相信完全避免使用普遍接受的解决方案（即使它已过时）与设计带有<div>标签而非<table>标签的表格是一回事，这样你就可以使用<div>。

在设计您的网站时，您可能不会要求使用<br />标记，但我仍然可以想象它们在需要用户输入的地方非常有用，例如。

我在使用<br />时看不到任何错误的，但没有遇到我要求使用它们的许多情况。在大多数情况下，如果这是您垂直分离内容所需的，那么可能有比使用<br />标签更优雅（更漂亮）的解决方案。

Answer 7

没有。为什么？它们是有用的结构。

添加此附录（附带人力资源），以防我的简短回答被解释为缺乏适当的考虑。 ;）

它可能并且通常是浪费时间 - 这是其他人通常付出的代价 - 试图提出跨浏览器CSS限制解决方案来解决BR和HR标签及其他人的UI问题喜欢，可以在两秒钟内解决。为什么有些UI人员浪费了那么多时间来尝试提出“纯粹”的方法来解决使用尝试真实的HTML结构，如换行符和水平规则对我来说是一个完全的谜。除了许多其他标签之外，这两个标签都是完全合法的，确实可供您使用。从这个意义上讲，“纯粹”是无稽之谈。

我工作的一位设计师根本无法做到这一点;他浪费了几个小时，有时几天，试图围绕它进行“编码”，并且仍然想出一些在Opera中无效的东西。我发现完全莫名其妙。老兄，加BR，做完了。完全合法，像魅力一样，每个人都很开心。

我全都是为了抽象演示，不要误会我的意思;我们全力以赴做最好的工作。但要明智。如果你花了五个小时试图找到一些方法来实现，在脚本中，BR现在给你的东西，并且众神不会因为这样做而下雨，然后去做，继续前进。如果这是有问题的，那么你的解决方案可能有问题，无论如何。

Answer 8

我在两个部分之间添加了<hr style="display:none">。例如，在多列布局中的列之间。在不支持CSS的浏览器中，分离仍然很清楚。

Answer 9

有趣的问题。我一直使用<br/>作为回车（因此作为内容的一部分，真的）。不确定这是不是正确的方法，但它很适合我。

另一方面，

<hr/> ......

Answer 10

我个人认为，为了真正分离内容和风格，应避免使用<br />和<hr />。

至于在我自己的标记中删除<br />标记，我将<div>与css margin属性结合使用来处理任何需要换行符的内容，以及{ {1}}用于内联的任何内容，但是使用不同的“内容类”（明显区别于<span>属性）。

要用css替换class标记，我只需创建一个<hr />，<div> css属性设置为border-top-style，其他三个边设置为{{1 }}。所述solid的{{1}}和none属性会处理水平线的实际放置/定位。

就像我说的那样，我不是专家，我的网页设计经验主要是我在JSP页面工作的副作用（我是一名Java程序员），但我在一些研究中遇到了这个问题，并想把我的两分钱......

Answer 11

BR很好，因为硬线断开可能是内容的一部分，例如在代码块中（即使你可能使用PRE元素）或歌词。

另一方面，HR是纯粹的表现形式：水平线，水平线。改为使用border-top / bottom作为相邻元素。

Answer 12

<br>是表达换行符的HTML方式，因为没有其他方法可以做到这一点。

源代码中的物理行中断被正确忽略（更准确地说：被视为单个空格），因此您需要一种标记方式来表达它们。

并非每个换行符都是新段落的开头，并且将文本打包到<div>中（例如）只是为了避免<br>对我来说过于偏执。他们为什么打扰你？

Answer 13

我认为你的模板中很少需要BR标签。但有时可以在内容，用户生成和系统生成中调用它。就像你想在段落中保留一段文字但在它之前需要换行符一样。

您觉得被迫使用BR标签的情况是什么时候？

Answer 14

我不会不惜一切代价但是如果你想要纯粹主义，那么这些标签与结构和布局的所有内容无关，但HTML应该将内容与呈现分开。 <hr />可以通过CSS和<br/>通过正确使用<p>等otehr标记来完成。

如果您不想成为纯粹主义者，请使用它们：）

Answer 15

确保包含指定XHTML的DTD。

如果您的DTD丢失或指定HTML4，将死肉作为HTML4或更低版本的正确解析将使用尖括号丢弃您的文档。

Answer 16

目前，人力资源部门在防止移动浏览器的字体膨胀算法无法入侵方面有一些骇人听闻的用途。

此外，如果您有大量由HR分隔的小内容，Googlebot目前会将其视为“N个单独的条目”，这可能对您有用。

BR应该只用作段落中的换行符，这是一种非常罕见的印刷用法（除了可能在表格单元格内），而且我不知道任何使用它们的hacky理由。

Answer 17

您可以使用<br>但不要使用<hr>。

<BR> - LINE BREAK
- 这是显示信息。还在常用，但限制使用。

<HR> - 水平规则 - 显示没有语义价值的信息 - 永远不要用它。根据定义，“水平”是一种视觉属性。

来源：Proper Use Guide for HTML Tags

Answer 18

这是一门课程的摘录，可帮助您学习html。

<form>
    <p>Choose your pizza toppings:</p>
    <label for="cheese">Extra cheese</label>
    <input id="cheese" name="topping" type="checkbox" value="cheese">
    <br>
    <label for="pepperoni">Pepperoni</label>
    <input id="pepperoni" name="topping" type="checkbox" value="pepperoni">
    <br>
    <label for="anchovy">Anchovy</label>
    <input id="anchovy" name="topping" type="checkbox" value="anchovy">

Answer 19

如果你要去严格，这是不好用的。

<br/>和<hr/>不属于内容。例如，<hr/>通常用于分隔文本块。但边境底部是不可能的？在许多情况下，<br/>被视为将文本限制为某种形式的一种方法，这种方法无法用css完成？

当然你不会严格，不要太担心。

是否应该在网页设计中不惜一切代价避免<hr />？

19 个答案: