在一个选择器中选择除第一个和最后一个td元素之外的所

Question

我在CSS中写了这样的东西：

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

我试图将此应用于表格单元格，这些表格单元格不是第一个，而不是.red类行中的最后一个。

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

Answer 1

可能会有所帮助

tr.red  td:not(:first-child):not(:last-child)
{
//your styles
}

<强> Sample

Answer 2

正如一些人所说，td：first-of-type为你提供第一个TD，其中td：first-child选择该tR的第一个子元素（如果它是TD）。这意味着，如果您有任何TH，您的代码将不会为您提供所有不是第一个或最后一个的单元格。

tr.red > *:not(:last-child):not(:first-child)
    { /* ... your css code ... */ }

我认为它应该以这种方式运作良好。即使你想为TH和TD分别设置代码，你也可以这样做：不是（：first-child）和td：not（：first-child）。当你想找到第一个带有一些标签名称的元素时，你的代码会更好，比如p：first-of-type，并给它一些不同的风格。

Answer 3

它在语法上是正确的，因为您可以使用W3C CSS Validator快速检查。已知验证器存在错误，因此原则上应根据CSS规范检查规则，尤其是Selectors Level 3。结果仍然是肯定的，这是正确的。

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

如果tr个元素的所有子元素都为td，则此情况适用。如果还有标题单元格，即th元素，则选择器应用于那些不是第一个数据单元格的数据单元格（td元素）或行{.red元素1}} class。