兼容范围：IE:6.0+，FireFox:2.0+，Opera 10.0+，Sarari 3.0+，Chrome参考资料：各游览器常用兼容标记一览表:标记 IE6 IE7 IE8 FF Opera Sarari*+Hack 应用情境（二）适用范围：IE:6.0,IE7.0,IE8.0,Firefox 之间的兼容实例说明：大家很容易的可以看出这是情境（一）的加强版，适用于更广泛的环境。其实情境（一）中也已经做到了把火狐与 IE 游览器区分开来了，现在我们要做的是把火狐从其它游览器中再次识别出来。大家仔细看下代码，大家会发现其实游览器识别是很简单的。火狐如何识别？对了，IE 中对伪类支持不广泛，所以伪类是个不错的途径。(.yourClass,x:-moz-any-link, x:default)注意，这个区分伪类往往IE7也能识别，所以最好还需要把 IE7单独识别出来，且此方法对 ff3.6 已无效，firefox 的区分可以使用-moz-document url-prefix()实例代码：.bbheight:32px;background-color:#f1ee18;/*所有识别 */background-color:#00deff9; /*IE6、7、8 识别*/+background-color:#a200ff;/*IE6、7识别*/_background-color:#1e0bd1;/*IE6识别*/.bb, x:-moz-any-link, x:defaultbackground-color:#00ff00;/*IE7 firefox3.5及以下 识别 */ -moz-document url-prefix().bbbackground-color:#00ff00;/* 仅 firefox 识别 */ * +html .bbbackground-color:#a200ff;/* 仅 IE7 识别 */*一个用于展示的 class 为 bb 的 div 标签*/Hack 应用情境（三）适用范围：IE:6.0,IE7.0,IE8.0,Firefox,Safari(Chrome)之间的兼容实例说明：我们现在将再次对我们的 CSS 进行加强了，使其能识别 Safari(Chrome)游览器。这是基于它们的内核 webkit 来识别的，用法为 media screen and (-webkit-min-device-pixel-ratio:0)实例代码：.bbheight:32px;background-color:#f1ee18;/*所有识别 */background-color:#00deff9; /*IE6、7、8 识别*/+background-color:#a200ff;/*IE6、7识别*/_background-color:#1e0bd1;/*IE6识别*/media screen and (-webkit-min-device-pixel-ratio:0).bbbackground-color:#f1ee18 /*safari(Chrome) 有效 */.bb, x:-moz-any-link, x:defaultbackground-color:#00ff00;/*IE7 firefox3.5及以下 识别 */-moz-document url-prefix().bbbackground-color:#00ff00;/*仅 firefox 识别*/* +html .bbbackground-color:#a200ff;/* 仅 IE7 识别 */*一个用于展示的 class 为 bb 的 div 标签*/Hack 应用情境（四）适用范围：IE:6.0+，FireFox:2.0+，Opera 10.0+，Sarari 3.0+，Chrome 全兼容实例说明：实例的具体代码在下面实例代码中已经列出，具体效果如此页面的顶端部分效果，您可以通过不同游览器检测该效果。这次我们基本把所有的主流游览器都兼容了，大家来看下代码。Opera 的识别有一部分归功于“0”标记，这个标记只被 IE8和 Opera 识别，特殊的标记往往造就的是我们更广泛的hack 手段。下例的代码比较完整，大家可以选择参考。实例代码：/* 各游览器兼容 CSS */.bbheight:32px;background-color:#f1ee18;/*所有识别*/ background-color:#00deff9; /*IE6、7、8识别*/ +background-color:#a200ff;/*IE6、7识别*/ _background-color:#1e0bd1/*IE6识别*/media screen and (-webkit-min-device-pixel-ratio:0).bbbackground-color:#f1ee18 /* Safari(Chrome) 有效 */media all and (min-width: 0px) .bbbackground-color:#f1ee18;/*opera and Safari(Chrome) and firefox*/ background-color:#4cac700;/* 仅 Opera 有效 */ .bb, x:-moz-any-link, x:defaultbackground-color:#4eff00;/*IE7、Firefox3.5及以下 识别 */-moz-document url-prefix().bbbackground-color:#4eff00;/*仅 Firefox 识别 */* +html .bbbackground-color:#a200ff;/* 仅 IE7 识别 */* 一般情况下 我们区分 IE7 只用 +background-color 配合 _background-color 就行了 如果必须写 .bb, x:-moz-any-link, x:default 这样的代码区分 Firefox3.5及以下 则谨记此写法对 IE7也有效，故在其中要再重写一次 +background-color 或者使用 * +html .bbbackground-color:blue; 方法仅对 IE7 有效。可使用 -moz-document url-prefix() 方法独立区分所有 firefox */.browsers tdwidth:8%;text-align:center;padding:8px;.browsercolorcolor:#333;font-size:18px;font-weight:bold;.ie6background-color:#1e0bd1.ie7background-color:#a200ff.ie8background-color:#00deff.firefoxbackground-color:#4eff00.operabackground-color:#4cac70.otherbackground-color:#f1ee18;#tipTable td,#tipTable thborder:1px solid black;width:56px;height:16px;text-align:center;#wordTable tdmargin-left:8px;#firefoxTipdisplay:none;#firefoxTip, x:-moz-any-link, x:defaultdisplay:block;/*IE7 firefox3.5及以下 识别 */+display:none/*再区分一次 IE7*/-moz-document url-prefix()#firefoxTipdisplay:block;/*仅 firefox 识别 */#ChromeTipdisplay:none;media screen and (-webkit-min-device-pixel-ratio:0)#ChromeTipdisplay:block; /* safari(Chrome) 有效 */media all and (min-width: 0px)#ChromeTipdisplay:none0; /* 仅 Opera 有效 */ IE6IE7IE8FirefoxOperaSafari(Chrome)IE6IE7IE8FirefoxOperaSafari(Chrome)Opera 的辨别色是深绿色，Opera 游览器很时髦么。Firefox 的辨别色是浅绿色，Firefox 是很强大的游览器。Safari 和 Chrome 的辨别色是金黄色，Safari 和 Chrome 使用的都是 Webkit内核IE8的辨别色是蓝色，新版 IE8的功能可是不少呢。IE7的辨别色是紫色，IE7还可以凑合着用！IE6的辨别色是红色，不过，IE6可是有点落后了！