重叠的 HTML 格式标签总是不好的做法吗? [英] Are overlapping HTML formatting tags always a bad practice?

问题描述

假设我需要有一个粗体和斜体相互重叠的文本，就像你看到的这句话一样.

Suppose I need to have a text with a bold and an italic part that overlap each other, like you see this sentence have.

现在，我知道正确的方法是将 CSS 和 HTML 完全分开，就像上面的例子一样，但这似乎有点矫枉过正.像这样写出 3 个跨度，并为粗体和斜体添加一个单独的类意味着您的用户将需要下载更多的数据，而不是像第二个示例中那样使用重叠的 b 和 i 标签:

Now, I know the proper way is to completely separate CSS and HTML as in the top example, but it just seems like overkill. Writing it out in 3 spans like that and adding a separate class for bold and italic means your user will need to download quite a bit more data than if you just use an overlapping b and i tag like in the second example:

.bold{
  font-weight: bold;
  }

.italic{
  font-style: italic;
  }

<div>I want this text to have both <span class="bold">bold</span> <span class="bold italic">and</span> <span class="italic">italic</span></div>

<div>I want this text to have both <b>bold <i>and</b> italic</i></div>

结果完全相同，但第二个使用的消费者带宽略小(可能只有几个字节，但所有这些都加起来了).我知道正确的方法仍然是第一个，但这总是正确的吗?html 开发指南是在 20 年前确定的，当时还没有带宽上限的消费级移动互联网.

The result is exactly the same, but the second one has a marginally smaller consumer bandwidth use (probably only a few bytes, but that all adds up). I know the correct method is still the first one, but does that always hold true? The guidelines for html development were determined 20 years ago, when consumer-grade mobile internet with bandwidth caps was not yet a thing.

此外，正如 Martin 正确评论的那样，以这种方式拥有大量跨度也比看到那些 B 和 I 标签并知道从这里到这里是粗体，从那里到斜体更难阅读那里".

In addition, as Martin rightfully comments, having a large amount of spans in this manner is also trickier to read later on than just seeing those B and I tags and knowing "it's bold from here to here, and italic from there to there".

推荐答案

结合 i 和 b 是完全可以的，但是，您需要确保正确嵌套它们.

Combining i and b is totally fine, however, you need to make sure to nest them correctly.

错误:

I want this text to have both <b>bold <i>and</b> italic</i>

正确:(当然取决于你想要达到的目标)

Right: (depending on what you want to achieve, of course)

I want this text to have both <b>bold <i>and</i></b> <i>italic</i>

这篇关于重叠的 HTML 格式标签总是不好的做法吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！