我有这些 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; }
有没有办法只有 1 节课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-"]
演示:http: //jsfiddle.net/K3693/1/
有关 CSS 属性选择器的更多信息,您可以在此处和此处找到。并且来自 MDN Docs MDN Docs