CSS 按钮悬停不起作用

Question

这对你们大多数人来说应该是一个简单的问题，但我无法理解它。我有下面的代码用于我的按钮，但我似乎无法让悬停工作，即使按钮的样式正确：

.eventmark .upcomming_bg {
background: #1178bd;
  background-image: -webkit-linear-gradient(top, #1178bd, #0c3c5c);
  background-image: -moz-linear-gradient(top, #1178bd, #0c3c5c);
  background-image: -ms-linear-gradient(top, #1178bd, #0c3c5c);
  background-image: -o-linear-gradient(top, #1178bd, #0c3c5c);
  background-image: linear-gradient(to bottom, #1178bd, #0c3c5c);
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
  border-radius: 28px;
  font-family: Arial;
  color: #ffffff;
  font-size: 11px;
  text-decoration: none;
}
.eventmark.upcoming.bg:hover{
 background: #3d7a80;
 background: -webkit-linear-gradient(top, #3d7a80, #2f5f63);
 background: -moz-linear-gradient(top, #3d7a80, #2f5f63);
 background: -o-linear-gradient(top, #3d7a80, #2f5f63);
 background: -ms-linear-gradient(top, #3d7a80, #2f5f63);
 background: linear-gradient(top, #3d7a80, #2f5f63);
}

请帮忙。

Answer 1

您在第一个代码块中的两个类之间有一个 space，但在第二个代码块中没有。所以，选择器是不同的。

Answer 2

eventmark.upcoming.bg

你确定那里没有空格吗？那等于

<div class="eventmark upcoming bg">

所有类分配给同一元素。

Answer 3

2 处错别字 error:corrected

.eventmark.upcomming.bg {
  background: #1178bd;
  background-image: -webkit-linear-gradient(top, #1178bd, #0c3c5c);
  background-image: -moz-linear-gradient(top, #1178bd, #0c3c5c);
  background-image: -ms-linear-gradient(top, #1178bd, #0c3c5c);
  background-image: -o-linear-gradient(top, #1178bd, #0c3c5c);
  background-image: linear-gradient(to bottom, #1178bd, #0c3c5c);
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
  border-radius: 28px;
  font-family: Arial;
  color: #ffffff;
  font-size: 11px;
  text-decoration: none;
}
.eventmark.upcomming.bg:hover{
 background: #3d7a80;
 background: -webkit-linear-gradient(top, #3d7a80, #2f5f63);
 background: -moz-linear-gradient(top, #3d7a80, #2f5f63);
 background: -o-linear-gradient(top, #3d7a80, #2f5f63);
 background: -ms-linear-gradient(top, #3d7a80, #2f5f63);
 background: linear-gradient(top, #3d7a80, #2f5f63);
}

CSS 按钮悬停不起作用

CSS Button hover not working

css

hover