在一个选择器中选择除第一个和最后一个td元素外的所有元素 [英] Select all except first and last td element in one selector

问题描述

我在CSS中写了这样的内容:

tr.red > td:not(:last-of-type):not(:first-of-type)
{
    color: #E53B2C;
    border-bottom: 4px solid #E53B2C;
}

我正在尝试将其应用于表单元格，这些单元格不是.red类的行中的第一个也不是最后一个.

它似乎按预期工作，但这真的是正确的方法吗?

解决方案

语法正确，因为您可以使用 W3C CSS验证程序.验证器已知有错误，因此原则上应根据CSS规范检查规则，尤其是选择器级别3 .结果仍然是，是正确的.

它也具有所需的含义，因为这是选择器的组合方式.您可以使用:not(...)选择器来表示"not ... and not ..."类型的条件.

这适用，只要tr元素的所有子元素均为td.如果存在头单元格，即也为th元素，则选择器将应用于那些不是具有.red类的行中的第一个数据单元格或最后一个数据单元格的数据单元格(td元素)./p>

I wrote something like this in CSS:

tr.red > td:not(:last-of-type):not(:first-of-type)
{
    color: #E53B2C;
    border-bottom: 4px solid #E53B2C;
}

I'm trying to apply this to table cells, which are not first and not last in the row with .red class.

It seems to work as expected, but is this really the right way to do it?

解决方案

It is syntactically correct, as you can quickly check using the W3C CSS Validator. The validator is known to have errors, so in principle, you should check the rule against CSS specifications, especially Selectors Level 3. The result is still that yes, it is correct.

It also has the desired meaning, since this is how selectors combine. You can use :not(...) selectors to express a condition of type "not ... and not ...".

This applies provided that all children of tr elements are td. If there are header cells, i.e. th elements as well, then the selector applies to those data cells (td elements) that are not the first data cell or the last data cell in a row with .red class.

这篇关于在一个选择器中选择除第一个和最后一个td元素外的所有元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！