谁能告诉我帮我为这个按钮制作一个正确的动画？（如按）[重复]答案

【问题标题】：Can anyone tell help me make a proper animation for this button? (as in pressing) [duplicate]谁能告诉我帮我为这个按钮制作一个正确的动画？（如按）[重复]
【发布时间】：2018-02-15 07:21:53
【问题描述】：

.button {
  font-size: 18px;
  font-family: Bradley Hand;
  color: purple;
  background: rgb(0, 255, 0);   /*Default settings for button*/
  border: 5px;
  width: 100px;
  height: 50px;
  transition-duration: 0.5s;
  border-radius: 10%;
}
.button:hover {
  background: rgb(0, 255, 125); /*Changes the buttons size, color,*/
  width: 120px;                 /*and font size*/
  height: 60px;
  font-size: 22px;
}

&lt;button class = "button"&gt;Click me!&lt;/button&gt;

我希望它看起来像您实际上正在按下一个按钮。有人帮忙！

【问题讨论】：

标签： html css animation button

【解决方案1】：

https://developer.mozilla.org/en-US/docs/Web/CSS/%3Aactive

.button:active { /* your code here */}

我建议你在点击时让它变暗，也许在里面添加一个渐变，让它看起来凹进去。

Style button when :active different from :hover

【讨论】：

谢谢！我会这样做的。
你能给我的问题投票吗？

【解决方案2】：

试着看看 w3schools 的这一面，他们有一些关于按钮动画的非常好的代码。 https://www.w3schools.com/howto/howto_css_animate_buttons.asp

【讨论】：

你能给我的问题投票吗？
如果你喜欢我的回答，你可以接受：)