Question

使用：first-child：last-child，在css中，它在IE7，FF中工作正常。

是否有任何可能的解决办法。

使用Javascript很好。如果它在没有javascript的情况下工作就会很棒。

Answer 1

您可以使用语义类名来减轻IE6中的痛苦。类似的东西：

  <ul>
    <li class="first">First Item</li>
    <li>Second Item</li>
    <li class="last">Last Item</li>
  </ul>

然后在你的CSS中使用：

ul .first { color: #F00; }
ul .last { color: #00F; }

Answer 2

全心全意，

这是我最终用于此解决方案的javascript版本。

  <script>

  $(document).ready(function(){
    $("ul li:last-child").addClass("last");
    $("ul li:first-child").addClass("first");

  });
  </script>

Answer 3

有一个确切的解决方案，不需要更改您的HTML。使用Microsoft“动态样式”。这是一个例子：

<html>
<head>
<style type="text/css">
tr td:first-child {font-weight:bold; background-color:green;}
tr td:last-child {background-color:orange;}
tr td {_font-weight:expression(this.previousSibling==null?'bold':'normal'); _background-color:expression(this.previousSibling==null?'lightgreen':(this.nextSibling==null?'orange':''));}
</style>
</head>
<body>
<table>
 <tr><td>First</td><td>Second</td><td>Third</td><td>Last</td></tr>
 <tr><td>First</td><td>Second</td><td>Third</td><td>Last</td></tr>
 <tr><td>First</td><td>Second</td><td>Third</td><td>Last</td></tr>
</body>
</html>

另见http://mauzon.com/pseudoclasses-first-child-and-last-child-for-ie6/。

Answer 4

修复一堆IE不一致的更通用的库是Dean Edwards的IE7：http://dean.edwards.name/IE7/

在IE6中是否有任何针对子选择器的修复

4 个答案: