CSS Hacks,Firefox 3.5和Google Chrome

时间:2009-12-09 19:16:06

标签: css google-chrome firefox browser

我搜索过,据称,body:nth-of-type(1)在CSS中仅用于定位Safari和Google Chrome。

瞧,Mozilla也正确地读了它。我搜索了十次但没有得到任何东西,所以我在这里。

是否只有谷歌Chrome浏览器的黑客攻击?

4 个答案:

答案 0 :(得分:13)

@media screen and (-webkit-min-device-pixel-ratio:0) { ... styles go here ... }

Chrome(AFAIK)没有CSS,而是Chrome和Safari。您可以考虑使用Javascript解决方案。

更新2013年1月22日:正如评论中所述,这可能不再安全。我找不到合适的替代方案。

答案 1 :(得分:11)

最好避免这些类型的黑客攻击,因为它们取决于新兴标准的可用性。很明显,随着时间的推移,新兴标准将越来越多地在更多平台上提供。换句话说,假设给定浏览器是[某些特定浏览器]是错误的,因为它具有[某些特定的CSS功能]。

Eric Wendelin的答案非常适合定位WebKit浏览器。还有一种定位Gecko浏览器的好方法:

@-moz-document url-prefix() {
    /* Gecko-specific CSS here */
}

添加WebKit定位(感谢Eric Wendelin):

@media screen and (-webkit-min-device-pixel-ratio:0) {
    /* Webkit-specific CSS here */
}

您可能还可以可靠地使用 构造中的CSS hacks 的“特征检测”样式来隔离版本,因为您已经正确隔离了引擎,并且您可以更安全地假设特定引擎版本之间的特征差异不会随时间而变化。

显然,隔离IE及其各种版本的最佳方法是使用条件注释,IE支持许多版本。

答案 2 :(得分:0)

任何-webkit选择器都适用于Chrome和Safari。

http://qooxdoo.org/documentation/general/webkit_css_styles

希望这就是你要找的东西。这是webkit网站:

http://webkit.org/

答案 3 :(得分:0)

@supports功能检测适用于Chrome 28及更新版本。

/* Chrome 28+ */

@supports (-webkit-appearance:none) { .selector { color:red; } }

我发布了这个浏览器 - 所以要么在browserhacks.com上测试它,要么在http://browserstrangeness.bitbucket.org/css_hacks.html#chrome测试我的实时个人css hacks测试网站。

我还有许多其他版本也针对特定的新版本进行了研究。我希望你喜欢它们。