我正在使用这些div进行样式设置.tocolor,但是我还需要唯一的标识符1,2,3,4等。因此,我将其添加为另一个类tocolor-1。
.tocolor
tocolor-1
<div class="tocolor tocolor-1"> tocolor 1 </div> <div class="tocolor tocolor-2"> tocolor 2 </div> <div class="tocolor tocolor-3"> tocolor 3 </div> <div class="tocolor tocolor-4"> tocolor 4 </div> .tocolor{ background: red; }
有没有办法只上一堂课tocolor-*。我尝试*在此CSS中使用通配符,但没有用。
tocolor-*
*
.tocolor-*{ background: red; }
您需要的称为属性选择器。以下是使用您的html结构的示例:
div[class^="tocolor-"], div[class*=" tocolor-"] { color:red }
div可以代替或添加任何元素,也可以代替或class添加指定元素的任何属性。
div
class
[class^="tocolor-"]—以“ tocolor-”开头。 [class*=" tocolor-"]—包含直接在空格字符后出现的子字符串“ tocolor-”。
[class^="tocolor-"]
[class*=" tocolor-"]
有关CSS属性选择器的更多信息,可以在此处和此处找到。以及来自MDNDocs的MDN Docs