我正在寻找一个CSS Select 器,让我 Select 列表的前最后一个子元素.

<ul>
     <li>1</li>
     <li>2</li>
     <li>3</li>
     <li>4</li>
     <li>5</li> <!-- select the pre last item dynamically no matter how long this list is -->
     <li>6</li>
</ul>

Static method:

ul li:nth-child(5)

Dynamic method:

ul li:last-child(-1)

当然这并不能验证,最后一个子元素似乎也不能提供一种动态的方式..我可以回溯到javascript,但我想知道是否有一种css方式被我忽略了

推荐答案

can:nth-last-child();事实上,除了:nth-last-of-type(),我不知道你还能用什么.我不确定你所说的"动态"是什么意思,但如果你的意思是,当更多的子元素加入名单时,这种风格是否适用于新的倒数第二个子元素,是的,它会的.Interactive fiddle.

ul li:nth-last-child(2)

Css相关问答推荐

自定义kendo色彩 Select 器中的清晰按钮

使用最小高度和边框使阴影DOM中的元素达到自定义元素高度的100%,如果溢出,还可以zoom 父元素

在GRID-TEMPLATE-ROWS中设置最大行数:Repeat()

Firefox中的解决方法:has(不使用JavaScript)

为什么CSS flex似乎应用了两次内部元素的填充?

如何使2个元素的宽度相同?

如何为图像堆叠效果下方的图层实现与磨砂玻璃类似的视觉效果

滚动弹性盒

为什么 width: 100% 在 Flex 父级中缩小这个 div ?

如何阻止 Mud Blazor MudTable 列扩展以适合文本

SASS 中的计算表达式

n 个元素的 CSS 关键帧动画

当计算的宽度不准确时,如何在 cypress 中测试元素的宽度?

我怎样才能让这个边框出现在按钮元素的上方?

flex-start 和基线有什么区别?

内联块在 Internet Explorer 7、6 中不起作用

为什么无论我做什么都不能改变复选框的 colored颜色 ?

带有 flexbox 的 css 正方形网格

使用 CSS go 除图像之间的空间

CSS关键帧动画CPU占用率高,应该这样吗?