我有一个css按钮样式和一些预定义的颜色样式.我使用颜色类为相同颜色的颜色和按钮样式着色以使按钮变圆.
如何在按钮上添加悬停样式以将颜色更改为较浅的阴影?我认为它会像.class class2:hover {etc}一样简单,但由于某种原因它不起作用.
这是我准备演示的小提琴:
http://jsfiddle.net/7n4Wy/
HTML
CSS
.red {
background: red;
}
.blue {
background: blue;
}
.button {
border-radius: 6px;
}
.button:hover .red:hover {
background: pink;
}
最佳答案
你所拥有的是试图匹配.red:悬停在内部.button:hover,这意味着你的标记中有一个嵌套元素.
原文链接:https://www.f2er.com/css/427524.html由于您选择了相同的元素,因此需要将两个类合并为一个:hover:
.red.button:hover {
background: pink;
}