【问题标题】:Less multiple classes rules using parent selector使用父选择器减少多个类规则
【发布时间】:2020-09-03 00:42:09
【问题描述】:

我有以下 HTML 结构:

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

还有一些 LESS 代码:

// 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
}

【问题讨论】:

    标签: css less


    【解决方案1】:

    你可以这样做:

    .block {
        &--is-focused&--is-disabled {
            ...
        }
    }
    

    【讨论】:

      猜你喜欢
      • 2017-07-31
      • 2013-04-30
      • 2015-07-19
      • 2013-11-21
      • 1970-01-01
      • 2012-09-22
      • 1970-01-01
      • 2018-01-15
      • 1970-01-01
      相关资源
      最近更新 更多