Html 悬停时按钮不改变颜色

我有一个css类分配给如下按钮：

。按钮{
保证金：4倍；
填充：4px；
宽度：96%；
高度：48px；
最大宽度：250px；
显示：内联块；
垂直对齐：中间对齐；
文本对齐：居中；
光标：指针；
溢出：隐藏；
空白：正常；
颜色：#232856；
边框：1px实心#3d8b40；
边界半径：8px；
背景：#f1f1
}
.按钮a{
颜色：#232856；
文本装饰：无
}
.按钮a：悬停{
颜色：#f1f1；
背景：#232856
}

。按钮

工作正常，完成了我需要它做的一切

但是

a

和

a:hover

部分没有任何作用

---

有什么想法吗？

你可以不用a:hover，只需使用

按钮：hover{

代码如下：

 .button {
  margin: 4px;
  padding: 4px;
  width: 96%;
  height: 48px;
  max-width: 250px;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  cursor: pointer;
  overflow: hidden;
  white-space: normal;
  color: #232856;
  border: 1px solid #3d8b40;
  border-radius: 8px;
  background: #f1f1f1
}

.button a {
  color: #232856;
  text-decoration: none
}

.button:hover {
  color: #f1f1f1;
  background: #232856
}

---

当你需要一个带有悬停效果的东西时，比如一个按钮，你不需要包括a:，只要写下按钮：悬停

我想你可能忘记了按钮的类，如果你想做一般的，那么在样式中使用

按钮

，而不是

。按钮

此外，您还忘记了

文本装饰后的分号：none

，因此此通道和同一块范围内的所有css样式都不适用

。按钮{
保证金：4倍；
填充：4px；
宽度：96%；
高度：48px；
最大宽度：250px；
显示：内联块；
垂直对齐：中间对齐；
文本对齐：居中；
光标：指针；
溢出：隐藏；
空白：正常；
颜色：#232856；
边框：1px实心#3d8b40；
边界半径：8px；
背景#f1f1；
}
.按钮a{
颜色：#232856；
文字装饰：无；
}
.按钮a：悬停{
颜色：#f1f1；
背景：#232856；
}

我的房间里有一个按钮

更改为

.button:hover a{
// styling when on hover
}

---

我想我把扣子弄坏了

.btn{
背景尺寸：10px 10px；
背景：重复线性梯度（45度，#606dbc，#606dbc 10px，#465298 10px，#465298 20px）；
身高：600%；
变换：旋转（-35度）；
过渡：0.3s；
}
.btn:悬停{
颜色：金色；
}



在我上空盘旋

你能给我看一下HTML代码吗？即使答案中的代码可能有效-按钮基本上是用来提交表单的。因此不需要用按钮标签包装a标签。如果你想要“按钮样式”的链接将a标记的css设置为display:inline bock；并将包含所有样式的鼠标悬停直接附加到它。谢谢你，Luckyfella，有用的信息。我的按钮不在表单中，它只是一个链接。我将对此进行研究。