下面是一个示例代码，展示了如何使用CSS过渡和动画来实现按钮悬停效果。

HTML代码：

悬停按钮

CSS代码：

.hover-button {
  background-color: #ccc;
  padding: 10px 20px;
  border: none;
  transition: background-color 0.3s ease;
}

.hover-button:hover {
  background-color: #555;
  color: #fff;
}

@keyframes pulse-animation {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1);
  }
}

.hover-button-animation {
  background-color: #ccc;
  padding: 10px 20px;
  border: none;
  animation: pulse-animation 1s infinite;
}

.hover-button-animation:hover {
  animation: none; /* 停止动画 */
  background-color: #555;
  color: #fff;
}

第一个示例使用了CSS过渡来实现按钮悬停效果。当鼠标悬停在按钮上时，背景颜色会渐变过渡到另一个颜色。

第二个示例使用了CSS动画来实现按钮悬停效果。按钮会以一定的节奏放大和缩小，形成一个脉动的效果。当鼠标悬停在按钮上时，动画会停止，并且按钮的背景颜色会改变。

你可以根据自己的需要调整颜色、动画效果等。