css - 仅在 CSS 中更改悬停按钮类

Question

我正在使用引导程序进行简单的测试 web 应用程序。我想要一个按钮以标准样式 ( ) 开始，并仅在悬停btn时切换到样式。btn-danger我知道这可以用 jquery 或直接 javascript 来完成，但我真的对这种方法不感兴趣。

我可以在直接 CSS 中执行此操作而不将任何引导样式代码复制到我自己的 CSS 中吗？理想情况下，我希望能够做这样的事情：

.mybutton {

}

.mybutton:hover {
  style: btn-danger;
}

http://jsfiddle.net/wPDCm/5/

Answer 1

使用 LESS（Twitter Bootstrap 使用的 CSS 预处理器）的语法应该是这样的：

.mybutton:hover {
    @include .btn-danger;
}

仅使用 CSS 是无法做到这一点的。

Answer 2

没有 CSS 预处理器就无法做到这一点。

使用SASS，您可以执行以下操作：

@mixin danger-will-robinson {
  background-color: red;
}

.btn-danger {
  @include danger-will-robinson;
}

.mybutton:hover {
  @include danger-will-robinson;
}

其他 CSS 预处理器也有类似的功能。