Css 有多个 类 在一个 :hover 时不工作

Question

我正在尝试构建一个与 :hover 属性 具有相同样式的 css class。 问题是，只有当我在元素上应用样式时，而不是在我指定新 class.

的地方

这是我的尝试：

.body_cal .cell_cal:hover .bg_cal, 
.body_cal .cell_cal .bg_cal .hover_cal {
  opacity: 0.2;
  transition: .3s ease-in;
}

我希望通过添加 hover_cal class 我会得到与将鼠标移到它上面相同的结果。

Answer 1

您可以通过将 .hover_cal 与 .cell_call:hover 伪 class 的顺序相同来实现相同的效果：

.body_cal .cell_cal:hover .bg_cal, 
.body_cal .hover_cal .bg_cal{
  opacity: 0.2;
  transition: .3s ease-in;
}