更改CSS去年(Changing CSS for last )

我想知道是否有某种方式来改变最后一个CSS属性li使用CSS的列表。 我已经调查使用:last-child ，但是这似乎真的越野车，我不能让它为我工作。 我将使用JavaScript如有必要，要做到这一点，但我想知道是否有人能想起来在CSS的解决方案。

Answer 1:

:last-child实在是做不修改HTML的唯一途径-但假设你能做到这一点，主要选择是只是为了给它一个class="last-item" ，然后执行：

li.last-item { /* ... */ }

很明显，你可以在你选择的动态页面生成语言自动执行此。 此外，还有一个lastChild在W3C DOM的JavaScript性能。

这里是做你想要的东西的例子原型 ：

$$("ul").each(function(x) { $(x.lastChild).addClassName("last-item"); });

甚至更简单：

$$("ul li:last-child").each(function(x) { x.addClassName("last-item"); });

在jQuery的 ，你甚至可以更紧凑写：

$("ul li:last-child").addClass("last-item");

另外请注意，这应该不使用实际工作last-child CSS选择器-而是，一个JavaScript实现的是使用-所以它应该是车少，跨浏览器更加可靠。

Answer 2:

我用纯CSS（ - ：p 3近年来比其他人后来可能是因为我来自未来）做到了这一点

假设我们有一个列表：

<ul id="nav">
  <li><span>Category 1</span></li>
  <li><span>Category 2</span></li>
  <li><span>Category 3</span></li>
</ul>

然后，我们可以很容易地使最后一项红色的文字：

ul#nav li:last-child span {
   color: Red;
}

Answer 3:

我通常结合CSS和JavaScript的方法，所以它的工作原理没有JavaScript在所有浏览器，但IE6 / 7，和IE6 / 7的JavaScript上（而不是关闭），因为它们不支持:last-child伪类。

$("li:last-child").addClass("last-child");

li:last-child,li.last-child{ /* ... */ }

Answer 4:

你可以使用jQuery的 ，做它是这样的方式

$("li:last-child").addClass("someClass");

Answer 5:

针对IE7 +及其他浏览器第一种选择是使用:first-child ，而是和你的反转风格。

例如，如果你设置在每个保证金li ：

ul li {
  margin-bottom: 1em;
}
ul li:last-child {
  margin-bottom: 0;
}

你可以用这个代替它：

ul li {
  margin-top: 1em;
}
ul li:first-child {
  margin-top: 0;
}

这将为其他一些情况下，像边境工作。

据sitepoint ， :first-child越野车，而只是它会选择一些根元素（文档类型或HTML），并且如果其他元件插入可以不改变样式的程度。

Answer 6:

2015年答 ： CSS最后的类型让你的风格的最后一个项目。

ul li:last-of-type { color: red; }

Answer 7:

我通常通过创建HTC文件做到这一点（当然最后child.htc。）：

<attach event="ondocumentready" handler="initializeBehaviours" />
<script type="text/javascript">
function initializeBehaviours() {
  this.lastChild.className += ' last-child';
}
</script>

而从我的IE条件CSS文件调用它：

ul { behavior: url("/javascripts/htc/last-child.htc"); }

而在我的主css文件我得到：

ul li:last-child,
ul li.last-child {
  /* some code */
}

使用你的存在CSS标记没有定义任何。去年，子类是院长爱德华兹另一种解决方案（虽然较慢） ie7.js库。

Answer 8:

：最后一个孩子是CSS3，没有IE支持，同时：第一，孩子是CSS2，我相信下面是使用jQuery来实现它的安全方法

$('li').last().addClass('someClass');

Answer 9:

$（ '礼'）最后（）addClass（ 'SomeClass的'）。;

如果你有多个

组只会选择最后一个礼。

Answer 10:

如果你知道有三个李时珍在你看的列表，例如，你可以这样做：

li + li + li { /* Selects third to last li */
}

在IE6，你可以使用表达式：

li {
    color: expression(this.previousSibling ? 'red' : 'green'); /* 'green' if last child */
}

我会建议使用专门的类或JavaScript（不是IE6表达式），但是，直到:last-child选择得到更好的支持。

文章来源: Changing CSS for last