W3C是否允许显示元素:inline;?(Does W3C allow elements to be display:inline;?)

编程入门 行业动态 更新时间:2024-10-26 22:18:13
W3C是否允许显示元素:inline;?(Does W3C allow elements to be display:inline;?)

进行代码审查时,我注意到标题使用的是<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元素是“内联”(也称为“文本级别”)。

...

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

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

所以这里有一个问题:这一部分是否使问题足够模糊,因为这里存在有效的意见分歧,或者它(正如我所想)以某种方式非常清楚? 如果本节可以解释,是否还有其他更具体的W3C指南?

我不想就此发表意见,我只是想确保我正确理解规范和W3C指南:这里是否存在真正的歧义?

Doing a code review, I noticed that a heading was using <span> tags instead of headings, so I suggested using an <h4> tag, to gain the semantic benefits. The context is a website footer, where there are various lists of links under different headings.

<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>

The counterargument was that <h4> is a "block-level" element, whereas an inline element was needed. Therefore he didn't think the element should be changed. (And yes, he knows CSS and is familiar with the display: inline; property.)

That sounds absolutely insane to me--goes against everything I always thought was best practice: separation of content and presentation, semantic web, the very purposes of HTML and CSS... yet in trying to formulate a response, I came across this section in the HTML 4.01 spec:

Certain HTML elements that may appear in BODY are said to be "block-level" while others are "inline" (also known as "text level").

...

Style sheets provide the means to specify the rendering of arbitrary elements, including whether an element is rendered as block or inline. In some cases, such as an inline style for list elements, this may be appropriate, but generally speaking, authors are discouraged from overriding the conventional interpretation of HTML elements in this way.

The alteration of the traditional presentation idioms for block level and inline elements also has an impact on the bidirectional text algorithm. See the section on the effect of style sheets on bidirectionality for more information.

So here is the question: does this section make the issue sufficiently vague for there to be valid difference of opinion here, or is it (as I had thought) pretty clear in one way or the other? If this section is open to interpretation, are there any other W3C guidelines that are more concrete?

I don't want to get into opinions on this, I just want to make sure I'm understanding the spec and the W3C guidelines correctly: is there true ambiguity here, or not?

最满意答案

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

从本质上讲,语义标记和样式之间不应存在任何隐式锁定关系。 与hX元素一样, div也是块级元素,但仅仅因为它与其他元素交互的方式,特别是它可以包含哪些元素 - 内联元素不能包含块元素,而块元素可以包含内联和块元素,明确定义的关系,如ul > li和table > tr > td 。 从本质上讲,语义和表示的分离应该保持严格,以至于标记语言HTML的规范甚至不应该提到样式表概念的存在 - 样式表可以应用于任何东西,而不仅仅是HTML和HTML提要这么多的技术而不只是浏览器。

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

TL; DR:没有歧义,你应该总是编写CSS以符合你想要显示HTML的方式,而不是让你的HTML适应CSS的要求。 从语义(和SEO)的角度来看,使用需要h4的span是完全错误的。

First of all, the quoted section is indeed from the 14-year old HTML 4.01 specification. I do not remember ever reading anything of the type in the HTML5 specs. I personally think it was deemed a good remark at the time but has since been obsoleted by experience. Don't forget that HTML4 was the one to actually properly separate HTML and CSS, and as such contains 'mistakes' like the quoted remark that were later 'corrected'.

In essence, there should not be any implicitly locked relationship between your semantic markup and your styling. Like the hX elements, a div is also a block level element, but only because of the way it interacts with other elements, most specifically which elements it can contain - an inline element must not contain a block element while a block element can contain both inline and block elements, bar explicitly defined relationships such as ul > li and table > tr > td. Essentially the separation of semantics and presentation should be kept so strict that the specifications of the markup language HTML should never even mention the existence of the concept of stylesheets - stylesheets can be applied to anything, not just HTML, and HTML feeds so many more technologies than just browsers.

From a web developer's perspective, you are absolutely right. The block nature of a h4 element merely implies its relationship with potential child elements, and its default representation in the browser's default stylesheet. What the CSS developer then wants to do with his stylesheet is his own choice - for all you care he applies a display:table-cell rule to it if that properly fits his design.

TL;DR: There is no ambiguity, and you should always write your CSS to conform to how you want to display your HTML, not adapt your HTML to the requirements of the CSS. Using a span where an h4 is required is just plain wrong from a semantic (and SEO) perspective.

更多推荐

HTML,inline,元素,elements,电脑培训,计算机培训,IT培训"/> <meta name="descr

本文发布于:2023-07-23 01:18:00,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1225575.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:元素   W3C   inline   display   elements

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!