我们应该在或标题内使用 标签周围的空格吗？

Question

我在 标题中使用标签(例如h1),并且作为我的渐进增强响应式设计的一部分(这是一个例外吗？) - 我想将它隐藏在较窄的视口中.

当然,CSS规则是:

h1 br {
    display: none;
}

但是在HTML中解决这个问题的正确方法是什么？

如果它是这样的,那么当br隐藏时,"heading"和"with"之间没有空格:

1) <h1>Example heading<br>with a break right thurr</h1>

那么以下语义是否正确？

2) <h1>Example heading <br>with a break right thurr</h1>

或者这个呢？

3) <h1>Example heading<br> with a break right thurr</h1>

我知道,非常挑剔,但我很好奇.

PS在这种情况下,绝对必须使用a,br因为单词"Example heading"比"break sturr"短 - 使用流体容器会在不需要的地方强行打破.

另外,正如David指出的那样,示例#2和#3都可以工作 - 但它们在语义上是否正确？虽然HTML标签周围的空格是语义的并且被忽略(这就是我们如何使标记很好阅读)......但是元素标签内的空格呢？他们应该在那里吗？

Answer 1

我认为你对br元素的使用是不正确的.它必须仅在换行符有意义时使用,而不是用于布局目的:

br 元素必须仅用于实际上是内容部分的换行符,如诗歌或地址.

您应该使用该span元素:

<h1>Example heading <span>with a break right thurr</span></h1>

RESP.

<h1><span>Example heading</span> with a break right thurr</h1>

使用CSS像:

h1 > span {display:block;}

所以现在也毫无疑问放置空间.如果br使用了,那么决定在何处/何时使用空格应该没有问题,因为它必须是一个有意义的中断(不一定是换行符),所以总会有一个某种类型的分隔符(换行符,分隔符)字符/图形,语音暂停等)

我们应该在<p>或标题内使用<br>标签周围的空格吗？