有时使用 是不是很糟糕？答案

【问题标题】：Is it sometimes bad to use ?有时使用 是不是很糟糕？
【发布时间】：2010-12-16 02:43:00
【问题描述】：

使用 标签有时是不是很糟糕？

我之所以这么问，是因为我的开发团队给我的第一个建议是：不要使用   ；相反，使用样式。但为什么？使用  标签会产生负面影响吗？

【问题讨论】：

找到最佳答案的最佳方法是去找你的开发团队，问他们为什么？
阿门... 询问来源，而不是猜测的人。
通常当员工是新员工时会出现“第一条建议”。新员工并不总是想问“为什么？”显然，有时最好问为什么，但我认为 Burak Ozdogan 在阅读这些问题后可能会理解“为什么”。或者至少理解 HTML 社区对这个主题的了解程度足以讨论它。我会说他来这里询问是正确的。

标签： html tags styles

【解决方案1】：

不使用 的主要原因是它不是semantic。如果您希望两个项目位于不同的视觉块中，您可能希望它们位于不同的逻辑块中。

在大多数情况下，这意味着只使用不同的元素，例如 StuffOther stuff，然后使用 CSS 将块适当地隔开。

在某些情况下  在语义上是有效的，即换行符是您发送的数据的部分的情况。这实际上仅限于 2 个用例 - 诗歌和邮寄地址。

【讨论】：

就我个人而言，我更喜欢用<pre/> 写诗。这样，您可以明确指定意图是保留原始构图，包括可能的缩进。
@MichałGórny 提出了一个很好的观点 -  s 似乎只适用于 all 以下条件适用的情况：1. 换行符在语义上有意义，2. 缩进是没有语义上有意义（否则你应该使用<pre>，3.不存在其他语义上合适的标签，如段落或标题标签。邮寄地址满足所有这三个条件，歌曲也是如此歌词。诗歌可能会违反“缩进没有意义”的条件，因此最好放在<pre> 中。
在签收电子邮件时使用  怎么样，例如：<footer>Sincerely, StrexCorp</footer> Opinions？

【解决方案2】：

我认为您的开发团队使用  代替边距。要在元素之间留出空白空间，请通过 CSS 使用填充/边距样式。

  使用不当：

<div>
   Content
</div>
<br />
<br />
<br />
<br />
<div>
     More content...
</div>

善用 ：

<style>
     div {
          margin-top:10px;
     }
</style>

<div>
   Content<br />
   Line break
</div>

<div>
     More content...
</div>

【讨论】：

你不能只删除你的
s 并添加 CSS，因为如果你删除了你的
s，就没有 to 样式了。在不帮助（字面上）填写空白的情况下说“删除换行符”并不是非常有帮助
你是对的，iamkoa，但这并不能解释为什么。因此它不回答这个问题。 24 票似乎有点多。
@iamkoa 你没有解释为什么。
我认为第二个选项更好，因为更干净，更简单我认为不需要使用 br

【解决方案3】：

通常，  表示 HTML 语义不佳。最常见的情况是使用  来声明段落分隔，在语义上有更好的方法来做到这一点。见Bed and BReakfast。

在某些情况下使用它是正确的标签，但它经常被滥用，以至于人们采取“不使用”的心态来强制更好的语义思考。

【讨论】：

【解决方案4】：

您的团队的意思可能是不要使用 s 来分割段落。例如：

<p>I am a paragraph</p>
<p>I am a second paragraph</p>

是更好的方法，因为您可以通过 CSS 轻松调整段落之间的间距。除此之外，我想不出任何反对换行的言论。

【讨论】：

【解决方案5】：

同样的概念也适用于为什么我们不使用表格进行布局 - 使用表格进行表格，使用 CSS 进行布局。

如果您想影响布局，请使用   在文本块和 CSS 中换行。

【讨论】：

【解决方案6】：

直接指定布局会使网站难以适应不同的页面大小或字体。

【讨论】：

【解决方案7】：

我通常会始终使用 CSS 为元素设置适当的边距和填充 - 除了语义上更正确之外，它比到处加载  s 少得多。

可能我唯一一次使用  而不是 CSS 设置的边距和填充，即使它在技术上并不严格正确，如果它是一个需要更多空间的孤立事件。如果我有一个相当大的样式表，并且似乎不值得为这种情况设置一个额外的样式，我可以一次性使用 。

像大多数事情一样， s 并不是一件坏事，只要它们使用得当。

【讨论】：

【解决方案8】：

如果你这样做： 

你会在不同的浏览器上得到不同的布局。

更深入：
如果您仅使用   换行 - 好的。
如果您使用   作为行分隔符 - 不行。

【讨论】：

【解决方案9】：

我尝试以禁用 CSS 的情况下易于阅读的方式编写我的标记。如果您只是使用 BR 来添加间距，最好使用边距和内边距。

【讨论】：

【解决方案10】：

  应仅用于换行符，而不应将样式应用于页面。例如，如果您需要段落之间的额外空间，请给它们一个类并将额外的填充应用于段落。不要用  展开你的段落

【讨论】：

【解决方案11】：

它们用于表示换行符。而已。不要像一般的 geocities 站点那样填满空间。然而，只有一种情况，它们可能可用于除换行以外的其他用途：清除浮动。

<br style="clear: both;">

【讨论】：

虽然使用过，但此方法不是有效的 XHTML。
您通常可以通过在包含元素上使用overflow:auto 来绕过这个“hack”。
@iamkoa：我不使用 XHTML。 HTML 是 HTML，而不是 XML。

【解决方案12】：

不要使用三个或更多连续的  s，这表明您将它们用于风格目的，不，您不应该。

有人会说一个  就足够了，而不是两个你应该使用，但是在某些情况下（例如剧本）你想引入一个更长的停顿而不意味着改变主题或新的句号开始，就像段落通常那样。

【讨论】：

【解决方案13】：

如果使用得当，它们很好。例如，您不应该使用它们来代替  标签或在元素之间创建间距。如果你连续有两个，你可能做错了。

【讨论】：

【解决方案14】：

这是一个示例   如何对样式产生负面影响（运行 sn-p 以获得视觉效果）

（注意右侧未对齐的按钮和奇数空间）：

button {
  width: 70px;
  height: 70px;
}
#arrows {
  border: solid thin red;
  display: inline-block;
}
#arrows span:first-of-type { 
  text-align: center; 
  display: block;
}
#moveUp {
  margin: 0;
}
/* In the current case instead of <br> use display */
/*
#arrows span:last-of-type { 
  display: block;
}
*/

<div id="arrows">
  <span>
    <button id="moveUp" value="üles">&uarr;</button> 
  </span>
  <button id="moveLeft" value="vasakule">&larr;</button> 
  <button id="moveDown" value="alla">&darr;</button> 
  <button id="moveRight" value="paremale">&rarr;</button> 
  <br>    <!-- note the shifted button and odd space on right -->
  <span>or move with keyboard arrows</span>
</div>

【讨论】：

【解决方案15】：

在 HTML 中（最高为 HTML 4）： 使用  
在 HTML 5 中： 首选  ，但   和 @987654324 @ 也可以接受
在 XHTML 中：   是首选。也可以使用 或 

所以使用  标签是完全有效的HTML。但是不推荐使用 ？

不使用 的主要原因是因为它不是语义标签并且里面没有内容。可以避免使用它，例如，

<p>some<br>text<p>

可以不用 标记为

 <p>some</p>
 <p>text<p>

如果您使用  其他目的，例如顶部间距等，可以通过 CSS margin 属性实现。

【讨论】：

请注意，使用
会在顶部和底部添加约 16px 的边距。将每个

标签的边距设置为 0px，以避免使用超出应有的高度来分隔行。