css - 选择 CSS/LESS 中的所有 BEM 修饰符

Question

我有以下 HTML 结构：

<div class="my-grid">
    <div class="my-grid__row item">
        <div class="item__statusA"></div>
        <div class="item__statusB"></div>
        <div class="item__statusC"></div>
    </div>
</div>

我想全选item__status*，但似乎无法在 LESS 中完成。到目前为止，我已经尝试过：

.item {
    &__ {
        color: red;
    }
}

知道如何选择所有类而不创建单独的类吗？

Answer 1

想要它是错误的，我怀疑这是可能的。

为元素创建修饰符的正确方法，HTML结构：

<div class="my-grid">
    <div class="my-grid__row item">
        <div class="item__status item__status_A"></div>
        <div class="item__status item__status_B"></div>
        <div class="item__status item__status_C"></div>
    </div>
</div>

较少的

.item {
    &__status {
        color: red;
    }
}

或混合元素，HTML 结构：

<div class="my-grid">
    <div class="my-grid__row item">
        <div class="item__statusA item__someElemforSemantic"></div>
        <div class="item__statusB item__someElemforSemantic"></div>
        <div class="item__statusC item__someElemforSemantic"></div>
    </div>
</div>

较少的

.item {
    &__someElemforSemantic {
        color: red;
    }
}