按钮填充动画

在鼠标悬停时创建填充动画。

• 设置 color 和 background，并使用适当的 transition 来动画化元素的变化。
• 使用 :hover 伪类在用户悬停在元素上时改变元素的 background 和 color。

<button class="animated-fill-button">提交</button>

.animated-fill-button {
  padding: 20px;
  background: #fff;
  color: #000;
  border: 1px solid #000;
  cursor: pointer;
  transition: 0.3s all ease-in-out;
}

.animated-fill-button:hover {
  background: #000;
  color: #fff;
}