如何用纯CSS制作咖啡杯开关动画效果每日一练？

本文共计700个文字，预计阅读时间需要3分钟。

在许多地方都能看到开关按钮，它的应用范围也很广。因此，我们今天来练习这种开关按钮的效果。这个按钮和平常看到的不太一样。

写在前面

开关按钮，我们在很多地方都会见到它，它的应用范围也比较广泛，因此，我们今天来练习这样一个开关按钮的效果，这个按钮跟我们平时见到的不太一样。

这是一个杯子，当我们点击杯子从off到on时，杯子由空杯变满杯，是不是很有趣？现在，我们一起来看一下今天练习案例的最终效果：

下面是这个案例的代码实现过程。