CSS 更改特定按钮的属性

Question

我有一个按钮类为 button.ttfm2 的按钮，但我想更改 button[type="submit"]:hover 这个特定按钮:

目前我当前的代码是:

.ttfm2 button[type="submit"]:hover {
background-color: #28AE47 !important;
}

我错过了什么？

Answer 1

正确的代码是:

button[type="submit"].ttfm2:hover {
   background-color: #28AE47; /* avoid using !important */
}

您尝试使用后代选择器选择 ttfm2 元素内提交类型的按钮，但您需要使用多重选择器，即具有类 ttfm2 的按钮

示例输出:

button[type="submit"].ttfm2 {
  transition: all ease 2s;
}
button[type="submit"].ttfm2:hover {
  background-color: #28AE47;
}

<button type="submit" class="ttfm2">Test</button>
<button class="ttfm2">This will not work</button>