CSS干按钮状态

有没有办法做到这一点，因为它只是重复相同的代码

.button-hover {
  color:                           $button-hover-font-color;
  background-color:                $button-hover-color;
  &:hover, &:focus, &:active, &:visited {
    color:                           $button-hover-font-color;
    background-color:                $button-hover-color;
  }
}

---

是的，试试简单的CSS语法：

.button-hover, .button-hover:hover, .button-hover:focus, .button-hover:active, .button-hover:visited {
    color:            $button-hover-font-color;
    background-color: $button-hover-color;
}

或者使用mixin：（我只知道较少的语法，但我想无论您使用什么预处理器，它都是类似的）

---

我相信您可以删除

&:hover、&:focus、&:active、&:visted

部分。只要类在元素上，颜色就不会适用于这些状态吗？就像@jbabey所说的使用级联！Casade在您悬停或按下按钮进入默认状态时不起作用。@jbabey如果您在使用

：link:hover

或

a:hover

之前指定了全局悬停状态，则此功能不起作用。

.button-hover {
    color:            @button-hover-font-color;
    background-color: @button-hover-color;

    &:hover, &:focus, &:active, &:visited {
        .button-hover();
    }
}