css - 匹配模式 css - 不工作

Question

我有一个要求，我需要将我的自定义颜色应用于功能区样式而不是默认样式。

所以，我已经检查了模式匹配 CSS 并在下面进行了尝试，但它不起作用。

我的实际 CSS:

.ms-cui-cg-**tl** .ms-cui-ct-first>.ms-cui-tt-a,
.ms-cui-cg-**tl** .ms-cui-ct-first>.ms-cui-tt-a:hover {
  border-left-color: #000;
}

.ms-cui-cg-**gr** .ms-cui-ct-first>.ms-cui-tt-a,
.ms-cui-cg-**gr** .ms-cui-ct-first>.ms-cui-tt-a:hover {
  border-left-color: #000;
}

因此，为了匹配这种模式，我创建了一些如下所示的 CSS。

div[class^="ms-cui-cg- .ms-cui-ct-first>.ms-cui-tt-a"],
div[class^="ms-cui-cg- .ms-cui-ct-first>.ms-cui-tt-a:hover"] {
  border-left-color: #000;
}

我正在尝试将模式与 **tl** 和 **gr** 匹配 谁能纠正我在这里犯的错误？

Answer 1

这个怎么样:

div[class^="ms-cui-cg-"] .ms-cui-ct-first>.ms-cui-tt-a,
div[class^="ms-cui-cg-"] .ms-cui-ct-first>.ms-cui-tt-a:hover {
  border-left-color: #000;
}

同样可以对 **gr** 做