CSS 中用于类的通配符选择器（*、^ 和 $）

CSS 提供了多种选择器，其中包括用于类的通配符选择器。这些选择器允许根据类名的不同部分来选择元素。

通用选择器（*）

通用选择器是最简单和最通用的选择器，它选择了元素的所有子元素。如果想要选择某个类的任意子元素，可以将通用选择器和该类名结合起来使用。

例如，以下 CSS 规则将应用于所有具有 sample-class 类的元素的子元素：

.sample-class * {
    color: red;
}

子串匹配选择器（^ 和 $）

子串匹配选择器可用于选择类名属性值的开头或结尾。这些选择器通过在选择器名称前面添加字符“^”或“$”来实现。

例如，以下 CSS 规则将应用于以“header-”开头的类的所有元素：

[class^="header-"] {
    font-weight: bold;
}

以下 CSS 规则将应用于以“-btn”的结尾的类的所有元素：

[class$="-btn"] {
    background-color: blue;
}

结论

通配符选择器和子串匹配选择器是强大的元素选择器。通过使用它们，可以根据类名中的不同部分选择元素，从而更灵活地控制样式。