首页  >  文章  >  web前端  >  如何在 CSS 中选择没有特定类的最后一个子元素?

如何在 CSS 中选择没有特定类的最后一个子元素?

Patricia Arquette
Patricia Arquette原创
2024-11-17 10:08:03779浏览

How to Select the Last Child Element Without a Specific Class in CSS?

在 CSS 中将 :last-child 与 :not(.class) 选择器组合

问题:

选择最后一个缺少特定类属性的子元素是否可行?例如,考虑以下 HTML:

<tr...></tr>
<tr...></tr>
<tr...></tr>
<tr>

目标是在此场景中选择第三行。

初始方法:

使用 CSS 选择器的初步尝试不成功:

tr:not(.table_vert_controls):last-child

答案:

纯 CSS 选择器无法完成此任务,因为 :last-child 仅对最后一个进行操作孩子。缺少类似的 :last-of-class 伪类。

替代解决方案:

  • 选择器 4 扩展: 在在不久的将来,可能会支持对 :nth-child() 和 :nth-last-child() 的扩展,从而可以将任意选择器作为参数传递。这将允许使用以下语法:
tr:nth-last-child(1 of :not(.table_vert_controls))
  • 附加类: 在有问题的类之前包含一个额外的类。
  • jQuery 选择器: 使用 jQuery 选择器,例如:
$('tr:not(.table_vert_controls):last')

以上是如何在 CSS 中选择没有特定类的最后一个子元素?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn