将CSS转换为LESS选择器

Question

我有一个类似的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（）吗？

Answer 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%;
}