将 CSS 转换为 LESS 选择器答案

【问题标题】：Convert CSS to LESS selector将 CSS 转换为 LESS 选择器
【发布时间】：2014-04-20 19:51:56
【问题描述】：

我有一个这样的 CSS：

.button-navigation-container button {
   /*some properties*/
}

        .button-navigation-container button.back-button,
        .button-navigation-container button.cancel-button {
            text-align: right;
            padding-right: 2%;
        }

但现在我想转换为 LESS，但我不确定应该使用哪种选择器来获得具有相同样式的 back-button 和 cancel-button。像这样的：

.button-navigation-container button {
       /*some properties*/

            /*Selector for cancel-button and back-button ?*/{
                text-align: right;
                padding-right: 2%;
            }
}

我应该使用extend()吗？

【问题讨论】：

你想把你的css转换成less吗？

标签： css css-selectors less

【解决方案1】：

少

.button-navigation-container {
    button {
        /*some properties for button*/
        &.back-button, &.cancel-button {
            text-align: right;
            padding-right: 2%;
        }
    }
}

样式表（从 LESS 生成）

.button-navigation-container button {
  /*some properties for button*/

}
.button-navigation-container button.back-button,
.button-navigation-container button.cancel-button {
  text-align: right;
  padding-right: 2%;
}

【讨论】：