CSS :last-of-type伪类使用问题：如何选中粘性单元格前的td

:last-of-type是基于元素类型（这里是<td>）来匹配父元素下的最后一个同类型元素，它不会考虑你用:not()做的过滤。你的场景里，每一行的最后一个<td>刚好是带.ds-dt-sticky-cell类的粘性单元格，所以td:not(.ds-dt-sticky-cell)会排除它，但:last-of-type依然只会指向这个被排除的最后一个<td>——两者叠加就找不到任何符合条件的元素了。

根据你的场景（最后一列固定为粘性列），可以用以下两种写法：

1. 匹配“后面跟着粘性单元格的<td>”（现代浏览器首选） #

利用CSS的:has()选择器，直接定位到后面紧接着是.ds-dt-sticky-cell的<td>，这就是你要的目标单元格：

table tr td:has(+ .ds-dt-sticky-cell) {
  background: red;
}

:has()目前支持所有现代浏览器（Chrome 105+、Firefox 121+、Safari 15.4+），写法直观且精准。

2. 定位倒数第二个<td>（兼容性拉满） #

如果需要兼容旧浏览器，比如IE或老版本Firefox，可以直接选中每一行的倒数第二个<td>——因为你明确最后一列是粘性单元格，所以倒数第二个就是目标：

table tr td:nth-last-child(2) {
  background: red;
}

这个写法兼容性极强，只要支持CSS2的环境都能正常工作，前提是每一行的<td>数量固定，最后一个必然是粘性单元格。

内容的提问来源于stack exchange，提问作者Evgeny