2

在进行代码审查时，我注意到标题使用<span>标签而不是标题，因此我建议使用<h4>标签来获得语义上的好处。上下文是一个网站页脚，其中有不同标题下的各种链接列表。

<span>Category 1 Links</span>
<ul>
    <li>Link 1 in the footer</li>
    <li>Link 2 in the footer</li>
    <li>Link 3 in the footer</li>
    <li>Link 4 in the footer</li>
    <li>Link 5 in the footer</li>
</ul>

反对意见是这<h4>是一个“块级”元素，而需要一个内联元素。因此，他认为不应该改变元素。（是的，他了解 CSS 并且熟悉该display: inline;属性。）

这对我来说听起来绝对是疯狂的——与我一直认为的最佳实践背道而驰：内容和表示的分离、语义网络、HTML 和 CSS 的真正目的......但是在试图制定回应时，我遇到了这个部分在 HTML 4.01 规范中：

某些可能出现在 BODY 中的 HTML 元素被称为“块级”，而另一些则是“内联”（也称为“文本级”）。

...

样式表提供了指定任意元素呈现的方法，包括元素是呈现为块还是内联。在某些情况下，例如列表元素的内联样式，这可能是合适的，但一般来说，不鼓励作者以这种方式覆盖 HTML 元素的传统解释。

块级和内联元素的传统表示习惯的改变也对双向文本算法产生影响。有关更多信息，请参阅样式表对双向性的影响部分。

所以这里有一个问题：本节是否使问题足够模糊，以至于在这里存在有效的意见分歧，或者它（如我所想的）以一种或另一种方式非常清楚？如果这部分可以解释，还有其他更具体的 W3C 指南吗？

我不想对此发表意见，我只想确保我正确理解规范和 W3C 指南：这里是否存在真正的歧义？

4

3 回答 3

3

W3C 规范允许display: inline使用标题元素。通常，HTML 规范不限制您在 CSS 中可以做什么，反之亦然。

您引用的块级和内联元素部分包含建议（“不鼓励”）。它是“不应该”，而不是“不应”陈述，即不是一致性标准。没有给出推荐的动机，但通常这样的想法是基于这样一个事实，即 HTML 文档可能由忽略样式表的软件处理，或者可能有作者样式表被覆盖，或者以其他方式优先考虑元素的定义含义而不是比他们的 CSS 样式。

尽管display: inline这里没有提到使标题成为内联元素（在设置的意义上）的可能性，但这样做是创建“插入标题”的一种方法的一部分（在段落开头出现内联的标题，而不是单独一行）。现在有一种更好的方法来实现这一点display: run-in，如CSS 基本框模型WD 所示。基本点还是一样的：可以将标题元素从其默认值display: block转换为类似内联的表示形式。

关于提出的具体案例，我不太明白为什么需要内联元素。下一个元素是ul，默认情况下会导致换行（和垂直间距）。如果将渲染ul更改为与 CSS 内联，则很难理解为什么不能对在逻辑上是列表标题的元素执行相同操作。

于 2013-08-20T06:10:44.367 回答
1

首先，引用的部分确实来自14 年前的HTML 4.01 规范。我不记得曾经阅读过 HTML5 规范中的任何此类内容。我个人认为这在当时被认为是一个很好的评论，但后来被经验淘汰了。不要忘记 HTML4 是真正正确分离 HTML 和 CSS 的一种，因此包含“错误”，例如后来被“纠正”的引用评论。

本质上，你的语义标记和你的样式之间不应该有任何隐含的锁定关系。与hX元素一样，adiv也是块级元素，但仅仅是因为它与其他元素交互的方式，特别是它可以包含哪些元素 - 内联元素不能包含块元素，而块元素可以包含内联和块元素，条形显式定义的关系，例如ul > li和table > tr > td。本质上，语义和表示的分离应该保持如此严格，以至于标记语言 HTML 的规范甚至不应该提到样式表概念的存在——样式表可以应用于任何东西，而不仅仅是 HTML，而且 HTML 提供了更多的技术不仅仅是浏览器。

从 Web 开发人员的角度来看，您是绝对正确的。元素的块性质h4仅仅暗示了它与潜在子元素的关系，以及它在浏览器默认样式表中的默认表示。然后 CSS 开发人员想要对他的样式表做什么是他自己的选择 - 只要你关心他会应用一个display:table-cell规则，如果它适合他的设计。

TL;DR：没有歧义，您应该始终编写 CSS 以符合您希望显示 HTML 的方式，而不是使您的 HTML 适应 CSS 的要求。从语义（和 SEO）的角度来看，使用需要spanan的地方h4是完全错误的。

于 2013-08-20T00:20:05.957 回答
1

在我看来，您在书籍或其他印刷媒体中看到的任何排版约定都是为网页建模的公平游戏。

例如，我见过有几列的教科书，每列都有一个标题，使用display: inlinetoh4标签可以达到这种效果。

在这个例子中，h4是在一个独立的块上还是水平序列的一部分将取决于内容以及您如何尝试向读者传达想法。

考虑一下您的页面将如何在不支持 CSS 的纯文本浏览器中呈现，文本的原始排序是否有意义？如果是这样，那么您选择的 HTML 可能是有效的。

另一方面，如果您使用表格标签并将它们转换为标题或列表项，那么如果页面被某种类型的音频浏览器读取，您可能会得到听起来不正确的 HTML（想想有视力障碍的人使用页面阅读器）。

让语义决定您使用的标签，并使用 CSS 来获得您需要的视觉布局。

于 2013-08-20T00:22:18.700 回答