面试题：CSS伪类选择器在按钮交互中的应用

Question

在前端页面中有一个普通按钮，要求使用CSS伪类选择器实现：当鼠标悬停在按钮上时，按钮的背景颜色变为蓝色，文字颜色变为白色；当按钮被点击后，背景颜色变为绿色，文字颜色变为黄色。请写出对应的CSS代码。

Answer 1

button:hover {
  background-color: blue;
  color: white;
}

button:active {
  background-color: green;
  color: yellow;
}