Question

如何在视图生成列表中的最后<li>添加“last”类？

Answer 1

您可以在li元素上使用 last-child 伪类来实现此目的

<html>
<head>
<style type="text/css">
ul li:last-child
{
font-weight:bold
}
</style>
</head>
<body>
<ul>
<li>IE</li>
<li>Firefox</li>
<li>Safari</li>
</ul>
</body>
</html>

还有一个第一胎伪类。

我不确定last-child元素在IE中是否有效。

Answer 2

或者，如果某些浏览器不支持last-child类，则可以通过JavaScript实现此目的。例如，此脚本为所有'ul'标记中的最后一个'li'元素设置类名，尽管它可以很容易地适用于其他标记或特定元素。

function highlightLastLI()
{
    var liList, ulTag, liTag;
    var ulList = document.getElementsByTagName("ul");
    for (var i = 0; i < ulList.length; i++)
    {
        ulTag = ulList[i];
        liList = ulTag.getElementsByTagName("li");
        liTag = liList[liList.length - 1];
        liTag.className = "lastchild";
    }
}

Answer 3

jquery是否与drupal捆绑在一起，如果是这样，你可以使用

$('ul>li:last').addClass('last');

实现这个目标

Answer 4

您可以将pesudo-class last-child ， first-child 用于第一个或 nth-child 用于任意数量的子< / p>

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

如何在视图生成列表中的最后一个<li>上添加“last”类？</li>

4 个答案: