怎么使一个css只有在IE789里面无效，在其他浏览器里有效

Posted 2023-05-10

首先不太清楚为什么这样做。。因为CSS，不管怎么样，浏览器肯定都会解析的，只是渲染效果不一样而已，并没办法全部都让它无效，因为即使使用HACK，很多IE高点的版本也是会认的。

所以可以通过，判断浏览器的版本，来新加CSS来覆盖。
css中判断IE版本的语句<!--[if gte IE 6]> Only IE 6/+ <![endif]-->：

1. <!--[if !IE]> 除IE外都可识别 <!--<![endif]-->

2. <!--[if IE]> 所有的IE可识别 <![endif]-->

3. <!--[if IE 5.0]> 只有IE5.0可以识别 <![endif]-->

4. <!--[if IE 5]> 仅IE5.0与IE5.5可以识别 <![endif]-->

5. <!--[if gt IE 5.0]> IE5.0以及IE5.0以上版本都可以识别 <![endif]-->

6. <!--[if IE 6]> 仅IE6可识别 <![endif]-->

7. <!--[if lt IE 6]> IE6以及IE6以下版本可识别 <![endif]-->

8. <!--[if gte IE 6]> IE6以及IE6以上版本可识别 <![endif]-->

9. <!--[if IE 7]> 仅IE7可识别 <![endif]-->

10. <!--[if lt IE 7]> IE7以及IE7以下版本可识别 <![endif]-->

11. <!--[if gte IE 7]> IE7以及IE7以上版本可识别 <![endif]--> 参考技术A 你可以使用hack使某个CSS属性在IE下和其他浏览器里面不一样。
hack写法：.bb
height:32px;
background-color:#f1ee18;/*所有识别*/
background-color:red\0; /* ie 8/9*/
background-color:blue\9\0; /* ie 9*/
background-color:#00deff\9; /*IE6、7、8识别*/
*background-color:#a200ff; /*IE6、7识别*/
_background-color:#1e0bd1; /*IE6识别*/


可以通过这种方式让各个浏览器效果不一样！也就达到了你说的“无效”那种效果。追问

background-color:#f1ee18;/*所有识别*/和background-color:#00deff\9; /*IE6、7、8识别*/弄在一起。ie678的时候会自动选择后面的吗，会冲突吗。。。

参考技术B 使用ie条件注释

http://www.blueidea.com/tech/web/2009/6547.asp

如何使Internet Explorer 8支持第n个child（）CSS元素？

我想给我的表行提供斑马条纹效果。在所有其他浏览器中，可以使用CSS第n个子元素完成。但我也想做IE 8。那怎么办呢？

答案

您可以使用支持IE的css3选择器的http://selectivizr.com/ JS。

另一答案

使用polyfill：Selectivizr足够好。

没有polyfill：由于IE8支持first-child，你可以欺骗它来支持iE8中的n-child，即

/*li:nth-child(2)*/
li:first-child + li {}/*Works for IE8*/

虽然我们无法模仿复杂的选择器，即IE8的nth-child（2n + 1）或nth-child（odd）。

另一答案

作为Selectivizr的替代品，您可以使用一些小jQuery：

$('.your-list li:nth-child(3n+1)').addClass('nth-child-3np1');

然后在CSS中添加第二个选择器：

:nth-child(3n+1)
{
    clear: both;
}

.nth-child-3np1
{
    clear: both;
}

另一答案

'first-child'和'+'选择器都可以在IE7中使用，'+'是可添加的。

因此，可以通过连续添加“+”选择器来模拟“n-child”，因此：

tr:nth-child(4)

变为：

tr:first-child + tr + tr + tr

如果所有兄弟元素都相同，则'*'通配符就足够了，如：

tr:first-child + * + * + *

如果指定了很多行，这将减少css文件的大小。

请注意，选择器之间的空格不是必需的，因此可以通过将文件大小删除来进一步减小文件大小，因此要选择第1行，第3行和第5行：

tr:first-child,tr:first-child+*+*,tr:first-child+*+*+*+*

当然，人们不想满足非常大的桌子！

如果使用*作为填充符，请确保:first-child元素和最后一个元素被赋予显式标记名，因为将针对DOM中的每个元素测试该规则，并指定这两个元素明确强制在特定浏览器的任何一端失败首先应用它的规则，而不是在它必须跨越每个序列中的几个元素以最终使每个元素的规则失败之后失败。不要让你的浏览器无故工作！