：最后一个孩子伪类选择在CSS和Internet Explorer

问题描述：

我有以下代码：：最后一个孩子伪类选择在CSS和Internet Explorer

ul.myList li{ 
    border-right: 1px dotted #000; 
}

然而，最后一个元素上，我需要删除边框为我从使然工作设计最后一项不需要边框作为分隔符。

所以，我需要为目标列表的最后一个孩子，所以我的CSS中我已经加入

ul.myList li:last-child{ 
    border-right: none; 
}

正如我们都知道，在Firefox，Safari和Chrome工作正常。

问题在于，当我们在Internet网页浏览，通过6至8

答

所以，一些周围挖掘后，我找到了答案：

如果浏览器是IE < 8，指定一个样式表是这样的：

<!--[if lt IE 8]> 
<link rel="stylesheet" href="css/ie_all.css" type="text/css" /> 
<![endif]-->

而且你的IE浏览器的样式表中指定以下规则：

ul.myList li{ 
    border-right: expression(this.nextSibling==null?'none':'inherit'); 
}

的nextSibling表达查看是否有后它的元素，并且如果存在继承在吨指定的规则他默认的样式表，如果没有，它会应用一个新的规则。

更多的信息可以发现here

+1这是可怕的，但它可能只是工作。再加上一个来为我提出一个适用于IE的可行解决方案。（对于IE来说，我们减去了一百万分，让我们首先得到这样的黑客）。值得指出的是IE9（目前处于测试阶段）可以支持它，所以你可能需要调整[如果IE]成为IE8或只有更低。 – Spudley 2010-09-24 11:19:41

感谢您的回复，如果IE 9支持它，我不是100％。我将调整我的帖子以反映IE 8及以下版本。 – 2010-09-24 11:21:30

IE9将支持它，根据他们自己的文档..然而，可靠的是。 – Kyle 2010-09-24 11:21:41

答

IE8 <不支持此伪选择。检查MSDN article所有支持的功能:)

你可以看看这个jQuery解决方案Enable pseudo selectors in IE，或只是把它留在IE中。

答

为此，您可以使用jQuery。所以，而不是依靠CSS。使用jQuery选择器来设置最后一个元素的属性。我明白你没有用它来标记你的问题。

jQuery('ul.myList li:last-child').css("Key","value");

答

如Internet Explorer版本之前9（仍处于开发中）完全不支持:last-child选择，我的最佳解决方案，不幸的是，是设置的最后一个元素上class和id的列表并尝试选择。

当然，如果留在IE不会彻底打破布局的右边界，你可能要照原样留下您的代码，如果你不介意IE搞砸了渲染只是一点点。

：最后一个孩子伪类选择在CSS和Internet Explorer

相关推荐