2

请注意此处提供的此 clearfix 解决方案。

为什么要为 HTML[xmlns] 定义单独的样式？

这是针对特定浏览器设计的 CSS hack 吗？

更新：这是有问题的代码，因为在我看来，有些答案显然离题了。

.clearfix {
    display: inline-block;
}

html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}

更新2：它已经或多或少地确定它是一个黑客。但我想要一个详细解释它的外部参考。例如，它适用于哪个浏览器，它究竟要解决什么问题？

4

4 回答 4

6

我联系了Stu Nicholls，试图找到关于这个黑客的确切来源。他回复并给了我以下信息：

element[attribute] 是一个w3.org CSS2 属性选择器，通常应用于 body 元素和属性，但在这种情况下，它使用标签及其 'xmlns' 属性。所以 [你知道的] 是隔离将识别或忽略这种风格的浏览器。答案是除了 IE5.x 和 IE6 之外，所有浏览器都会识别这种风格。所以所有浏览器都会将 .clearfix 设置为内联块，然后除了 IE5.x 和 IE6 之外的所有浏览器都会将其重新设置为块。
然后使用 * html 前缀来定位 IE5.x 和 IE6，仅将 .clearfix 元素的高度设置为 1%。

于 2011-01-05T14:32:45.163 回答
4

设置display: block而不是display: inline-block不支持属性选择器的浏览器是一种技巧。

关于 CSS hack 的常见评论适用——条件评论通常是更好的选择，如果你确实使用了 hack，你应该包含一个解释它的评论。

于 2011-01-05T14:10:15.470 回答
0

它可能是一个包含 HTML 或 XHTML 页面的网站。XHTML 页面将具有命名空间 (xmlns)，因此这种样式将专门针对这些页面。我不确定是否在不支持 XHTML 的浏览器中加载了 xmlns 属性。如果在这些浏览器中忽略此属性，这也可能是在这些浏览器中应用不同样式的技巧。

无论哪种方式，我最多将其称为技巧，而不是黑客。

于 2011-01-05T13:31:59.483 回答
0

它以属性为 xmlns 的 html 标记为目标。开发人员可能在他们的站点中有多个页面，但出于某种原因，并非所有页面都包含 xmlns 属性。这段代码并没有什么奇怪的地方，但分离的原因真的只能由这样做的开发人员给出。正如我所看到的，该规范只会影响站点中在 html 标记中包含该属性的页面。

于 2011-01-05T13:24:34.380 回答