Html CSS不选择不使用子字符串选择器

我在一个表中有几个

标记，我想更改它们的颜色，除非第一个标记。我尝试了css

：not

选择器，但当将子字符串选择器放入其中时，它不起作用。只有当我直接输入元素的

id

时，它才起作用。 但是，我想让它更具动态性（例如，不需要每次都更改

id

）。我该怎么做

//This is not working
th[id*="header"]:not(th[id*="header0"])

//This is working
th[id*="header"]:not(#header0)

/*
th[id*=“header”]：不是（th[id*=“header0”]）{
颜色：红色；
}
*/
th[id*=“header”]：非（#header0）{
颜色：红色；
}

校长
校长2
校长3
校长4
校长5
校长6

与其尝试各种方法，为什么不使用下面这样的简单方法呢

th{
  color: red;
}
th:first-child{
  color: black;
}

这比像这样使用更兼容：

th:not(:first-child) {
   color: red;
}

---

回答你的问题：

//This is not working
th[id*="header"]:not(th[id*="header0"])

因为

th[id*=“header”]

会选择id在任何地方都有头字符串的所有th元素，并使用not选择器，您的意思是使用

：not（th[id*=“header0”）

会选择

th[id*=“header”]

中没有的子元素，即th的th。即使是

：not

选择器也不能用于复杂选择器。请参见此以查看简单选择器

//This is working
th[id*="header"]:not(#header0)

---

这是有效的，因为它表明您没有选择同一标头的

#header0

th元素

th[id*=“header”]

而不是尝试各种方法，为什么不使用下面这样的简单方法呢

th{
  color: red;
}
th:first-child{
  color: black;
}

这比像这样使用更兼容：

th:not(:first-child) {
   color: red;
}

---

回答你的问题：

//This is not working
th[id*="header"]:not(th[id*="header0"])

因为

th[id*=“header”]

会选择id在任何地方都有头字符串的所有th元素，并使用not选择器，您的意思是使用

：not（th[id*=“header0”）

会选择

th[id*=“header”]

中没有的子元素，即th的th。即使是

：not

选择器也不能用于复杂选择器。请参见此以查看简单选择器

//This is working
th[id*="header"]:not(#header0)

---

这是因为它表明您没有选择同一标题的第th元素

th[id*=“header”]

您可以使用第一个子选择器，而不选择

th:not(:first-child) {
    color: red;
}

---

可以将第一个子选择器与not一起使用

th:not(:first-child) {
    color: red;
}

我怀疑你在找这样的东西

th[id^=“header”]：不是（[id$=“0”]）{
颜色：红色；
}

校长
校长2
校长3
校长4
校长5
校长6

我怀疑你在找这样的东西

th[id^=“header”]：不是（[id$=“0”]）{
颜色：红色；
}

校长
校长2
校长3
校长4
校长5
校长6

为什么不直接使用第一个孩子？例如：

th:not（：first child）{…}

为什么不直接使用first child呢？这正是我需要的。有时校长可能不是我的第一个孩子。这正是我需要的。有时校长可能不是我的第一个孩子。