Question

在这种情况下，可以不将margin-right应用于上次li。

我在IE6和7中也需要纯粹的CSS方式和支持，而且不需要更改 HTML 。有没有办法实现这一目标。

ul li {display:inline;margin-right:10px}

<ul id="nav">
    <li><a href="#nowhere" >Lorem</a></li>
    <li><a href="#nowhere" >Aliquam</a></li>
    <li><a href="#nowhere" >Morbi</a></li>
    <li><a href="#nowhere" >Praesent</a></li>
    <li><a href="#nowhere" >Pellentesque</a></li>
</ul>

Answer 1

您可以使用IE CSS表达式来实现此目的。

ul#nav li {
    margin-right: 10px;
    /* for IE only: */
    margin-right: expression(this.nextSibling == null ? '0' : '10px' );
}

/* for standards browsers: */
ul#nav li:last-child {
    margin-right: 0;
}

经过测试，可在IE7中使用。我无权访问IE6，但它的工作原理相同。

如果可能，最好将表达式规则放在仅IE样式表中。

Answer 2

您可以在标记上添加负底边距。我甚至不知道这是否有用，但值得一试。

Answer 3

给最后一个<li>一个班级，然后将margin-right: 0px应用到班级。

CSS3中有一个:last-child伪类，但在IE 6或7中不起作用。

Answer 4

通常我建议使用:last-child选择器，但IE 6和7不支持此选项。

您可以向最后一个li元素添加一个类，并将类似margin-right: 0的样式应用于该元素。

在不更改HTML的情况下，我不知道任何纯css 方法可以在IE 6或7中使用。

如何从支持IE 6的纯CSS中删除上一个li的边距？

4 个答案: