3

下面是我的html结构

<div class="footerMenu">
   <ul>
     <li>Home</li>
     <li>About</li>
     <li>Feedback</li>
     <li>Contact us</li>        
   </ul>            
</div>

但

.footerMenu li:last-child { }

选择器似乎在 IE8 中不起作用。但是http://msdn.microsoft.com/en-us/library/cc351024%28VS.85%29.aspx告诉我们支持伪选择器。对此有任何帮助！

4

7 回答 7

27

你读错了。它说它在 IE8 中不受支持：

如果您正在查看:first-childIE7 和 IE8 支持，并认为这同样适用于:last-child......惊喜！它没有。

:first-child是一个 CSS2 选择器，但:last-child仅在 CSS3 中引入，因此由于 Microsoft 的目标只是 CSS2.1 与 IE8 的兼容性，因此他们可能:last-child直到 IE8 之后才关心。

如果你知道你只有四个li元素，那么你应该能够使用相邻的兄弟选择器来达到第四个li：

.footerMenu li:first-child + li + li + li
于 2012-05-29T13:53:34.587 回答
2

为了建立其他人的答案，另一种选择是使用 javascript 来填补空白，selectivizr 是添加最后一个孩子支持的一个很好的例子。

http://selectivizr.com/

于 2012-05-29T13:56:02.693 回答
1

您提供的链接显示它不支持 IE8... 仅 IE9+。谷歌搜索 last-child IE8 带来了一大堆类似的查询。

于 2012-05-29T13:53:36.717 回答
1

你在哪里读到的？:first-child支持回 IE7，但:last-childIE9 及更高版本。

不，它没有。

（为方便起见，标题向下移动）

于 2012-05-29T13:54:10.450 回答
0

尝试使用类似的东西：

.footerMenu li {background-color: expression(this.previousSibling==null?'red':'green');}
于 2012-05-29T14:00:47.213 回答
0

其他答案是正确的，IE8 不支持最后一个孩子。但是，为了解决您的特定问题，您可以a）手动将一个类添加到最后一个<li>或b）因为这是一个菜单，并且这些可能在其中有链接，使用属性选择器定位最后一个链接，这确实有效在 IE8 中。就像是

.footermenu a[href="contact.html"] { ... }
于 2012-05-29T13:55:41.503 回答
0

我知道它很旧，但是......有一种简单的方法可以做到：

只是在你想要改变的 li 中这样做：

<li style="yourstyle;">...</li>

于 2014-06-18T23:28:41.153 回答