Question

我有以下css需要改变没有类“myClass”的last-child但我似乎无法让它工作。

我出错的任何想法？

ul li:not(.myClass):last-child a {
    font-style:italic;
}

请求的示例html：

<ul>
    <li><a href="#">one</a></li>
    <li><a href="#">two</a></li>
    <li><a href="#">three</a></li>
    <li class="myClass"><a href="#">Extra</a></li>
</ul>

我想把css应用到li三......

Answer 1

只有当你能够使用jQuery时才能用css完成这项工作，你可能会觉得这个解决方案很有帮助。

http://jsfiddle.net/6ku3Y/

$('ul li').not('.myClass').last().find('a').addClass('mystyle');

Answer 2

如果您确定要定位的元素是最后一个元素，则可以使用nth-last-child(2)

ul li:nth-last-child(2) a {
    border-right:0px solid #000;
}

Answer 3

如果您只想将css应用于li三，请尝试：nth-child（3）

ul li:nth-child(3) a {
    border-right:0
}

http://jsfiddle.net/hhncn/

这个伪类根据它们的位置匹配元素在父元素的子元素列表中。 - http://reference.sitepoint.com/css/pseudoclass-nthchild

Answer 4

尝试这样的事情：

ul li:not(.myClass):nth-last-of-type(2) a {
    border-right:0px solid #000;
}

SEE DEMO

Answer 5

当前的CSS语法无法让AND运算符执行此类样式。您需要的是CSS LESS框架。

这将允许您这样做：

ul > li:not(.myClass) {
  li:last-child {
    //style here
    }
}

CSS3不是带有last-child的选择器

5 个答案: