使用父选择器减少多类规则

编程问答 2022-08-12

问题描述

我具有以下HTML结构：

<div class="block">
  <div class="block--is-disabled block--is-focused">Block</div>
</div>

还有一些更少的代码：

// LESS
.block {
  &--is-disabled {
    // some styles
  }

  &--is-focused {
    // some styles
  }
}

是否可以使用LESS父选择器应用.block--is-disabled.block--is-focused之类的样式？我唯一遇到的是：

// LESS 
.block {
  &--is-focused & {
    &--is-disabled {
      // some styles
    }
  }
}

具有以下CSS输出：

.block--is-focused .block--is-disabled {
  // some styles
}

但是我需要得到的是下一个CSS：

.block--is-disabled.block--is-focused {
  // some styles
}

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

less