css - 是否有其他方法可以在 css 中选择这些节点

Question

如何选择我在下图中标记的这些节点

这是我的写法，我想知道是否有其他方法

.m1 > div, .m2 > div, .m3 > div, .m4 > div{}

标签： css

Answer 1

div[class^="m"] > div {
    background: #ffff00;
}

<div class="m1">
  <div>text</div>
</div>
<div class="m2">
  <div>text</div>
</div>
<div class="m3">
  <div>text</div>
</div>
<div class="m4">
  <div>text</div>
</div>

您可以对以“m”开头的类使用通用选择器...如下所示，

div[class^="m"] > div {
    background: #ffff00;
}

您还可以选择任何包含常见单词/字符的类，如下所示：

div[class*="m"] > div {
    background: #ffff00;
}