CSS - 选中最后一个元素（选择器）

在前端开发中，我们经常需要对页面中的元素进行样式的调整。有时候，我们可能需要选中最后一个元素来实现特定的效果。在 CSS 中，我们可以使用 :last-child 伪类选择器来选中最后一个元素。

:last-child 伪类选择器

:last-child 伪类选择器可以用来选中某个元素的最后一个子元素。具体使用方式如下：

selector:last-child {
    /* 样式规则 */
}

其中，selector 是要选中的元素的选择器。

假设我们有一个有序列表，我们希望给最后一个列表项添加一个特殊的样式。我们可以使用 :last-child 伪类选择器来实现这个效果。首先，在 HTML 中添加一个有序列表：

<ol>
    <li>项目 1</li>
    <li>项目 2</li>
    <li>项目 3</li>
    <li>项目 4</li>
</ol>

然后，在 CSS 中使用 :last-child 选择器来选中最后一个列表项并添加样式：

ol li:last-child {
    color: red;
    font-weight: bold;
}

在这个例子中，我们选中了有序列表中的最后一个列表项，并将其文字颜色设置为红色，字体加粗。

:last-child 伪类选择器在现代浏览器中有良好的兼容性。然而，在一些旧版本的浏览器中可能不被支持。如果需要兼容旧版本浏览器，可以使用 JavaScript 来实现类似的效果。

在前端开发中，了解常用的选择器是非常重要的。使用 :last-child 伪类选择器可以帮助我们选中页面中的最后一个元素，并对其进行样式调整。希望通过本文的介绍，您对 CSS 中的 :last-child 选择器有了更深入的了解。