如何为没有.less的两个类的按钮创建一个CSS选择器？

Question

我有这个CSS：

    button {

        background: @button-background;
        color: @text;

        &.focus {
            background-image: linear-gradient(#79d858, #569e3d);
            border-color: #4a993e;
            color: white;
        }
     }

如何在按钮具有.focus和：hover时创建另一个CSS？请注意.focus是我添加到按钮的一个类，如果一个按钮有焦点则没有任何关系。感谢

Answer 1

如评论中所述，您可以使用&:hover

＆＃13;

＆＃13;

button {
  background: @button-background;

color: @text;

&.focus {
    background-image: linear-gradient(#79d858, #569e3d);
    border-color: #4a993e;
    color: white;
    &:hover {
      color: red;
    }
  }
}

＆＃13;

＆＃13;

＆＃13;

如需进一步阅读，建议您查看here

Answer 2

button {

    background: @button-background;
    color: @text;

    .focus {
        background-image: linear-gradient(#79d858, #569e3d);
        border-color: #4a993e;
        color: white;

        &:hover {
            ...
        }
    }
 }

注意：焦点上的＆符号是多余的。