CSS Hack firefox 3.5 及以下？

Question

我使用的 ff 3.5 及更早版本（不是 3.6）是否有任何 css hack

.SubTabs ul, x:-moz-any-link
{
    /* IE7,6 Hack*/
    *top: -28px;
}

但这适用于所有 FF 浏览器版本..

Answer 1

很好地解决了一些不是 100% 完美但应该可以工作的问题

/// <reference path="jquery-1.3.2-vsdoc2.js" />
$(document).ready(function() {
    if ($.browser.mozilla) {
        $('body').addClass("mozilla");

        var versionParts = $.browser.version.split("\.");
        var version = 0;
        if (versionParts.length > 0) {
            version = version + versionParts[0] * 1000000000000;
        }
        if (versionParts.length > 1) {
            version = version + versionParts[1] * 1000000000;
        }
        if (versionParts.length > 2) {
            version = version + versionParts[2] * 1000000;
        }
        if (versionParts.length > 3) {
            version = version + versionParts[3] * 1000;
        }

        if (version >= 1009002000000) {
            $('body').addClass("mozilla3-6andAbove");
        }
        else {
            $('body').addClass("mozilla3-5andBelow");
        }
    }
});

现在您可以在您的 css 文件中添加 body.mozilla3-5andBelow 并且它应该可以工作...

Answer 2

使用@-moz-document at 规则定位任何版本的 Firefox，然后使用 @media -moz-scrollbar-start-backward 媒体查询覆盖 Firefox 3.6+ 的选择器：

@-moz-document url-prefix() 
 { 
 .SubTabs ul
  {
  top: -28px;
  }
 }

/* Firefox 3.6+ Filter */
@-moz-document url-prefix() 
 {  
 @media -moz-scrollbar-start-backward 
  { 
  .SubTabs ul
    {
    top: -10px;
    }
  }
}

Answer 3

为低端版本创建 Firefox hack 确实需要一个通用的，第二个覆盖。

这是我创建的一对。

我在 browserhacks.com 上发布的第一个，因此您可能会认出它：

/* Firefox (any) */

_:-moz-tree-row(hover), .selector { top: 0px; }

然后是覆盖：

/* Firefox 3.6 and newer (use this to override) */

_:-moz-handler-crashed, :root .selector { top: -28px; }

要现场测试这些和许多其他内容，您可以在我的现场 css hacks 测试页面上试用它们：http://browserstrangeness.bitbucket.org/css_hacks.html#firefox

享受吧！