SPAN内部的H2 - 浏览器兼容



首先,我已经看到了这个问题IE兼容性问题,但我有一个稍微不同的问题:

我有一个跨度display: block,我想在其中放一个 H2 标签。这在每个(主要)浏览器中看起来都不错吗?

前面提到的链接上的答案是 使 H2 display:inline ,我不想要,我也不想用div替换span,因为我将不得不更改很多 CSS。

附言。我不希望我的 HTML 验证(使用验证器),我只想让它工作。

当你说"我不希望我的HTML验证(使用验证器)时,我只是希望它工作。你犯了一个非常大的错误。如果HTML没有验证,就不知道会发生什么。标准的存在是有原因的。

将跨度替换为div,您不需要在div 上显示块,因为它默认具有此块。跨度是内联级别元素,而 H2 是块级别。内联元素不能包含块级元素(在 HTML5 之前为 true,您可以在锚点中包装块级元素)

这将验证,并且会起作用

它适用于当前的浏览器(包括旧版本),并且不太可能改变。像这样的错误很常见,以至于浏览器供应商更改其错误恢复机制毫无意义。HTML5即将使错误恢复规则成为强制性的。

另一方面,将spandisplay: block一起使用而不是使用div有什么意义?并且应该编写 CSS,使其不依赖于标记元素的特定选择,而不同的选择可能有意义;例如,通常,.foo是比span.foo更好的选择器。

对标记或样式表的任何广泛更改都有不可忽视的导致问题的风险,即使更改是这样的改进和简单的更改。(例如,全局搜索和替换通常会执行太多操作,或者遗漏某些内容。这可能是继续使用无效标记的原因,

如果在实践中风险最小。

我们可以先解决IE二线问题

h2{}
h2 span{ float:right;}

所有浏览器中的正确方法

<h2><span>sub content</span>  Heading</h2>

错误的方式即浏览器

<h2>Heading<span>sub content</span></h2>

最新更新