Is there any Fix for child selector in IE6

问题

While using :first-child :last-child , in css its works fine in IE7, FF.

Is there any possible fix for this.

Use of Javascript is fine. If it works without javascript it would be great.

回答1:

You can use a semantic class name to ease your suffering in IE6. Something like:

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

And then in your CSS use:

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

回答2:

Thanks all,

Here is the javascript version which I finally used for this Solutions.

  <script>

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

  });
  </script>

回答3:

There's an exact solution that doesn't require changes to your HTML. Use Microsoft "Dynamic Styles". Here's an example:

<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>

Also see http://mauzon.com/pseudoclasses-first-child-and-last-child-for-ie6/ .

回答4:

A more generic library that fixes a bunch of IE inconsistencies is Dean Edwards' IE7: http://dean.edwards.name/IE7/

来源：https://stackoverflow.com/questions/982759/is-there-any-fix-for-child-selector-in-ie6

标签

internet-explorer-6