伪类和CSS3动画的合并使用

伪类和CSS3动画的合并使用

开发工具与关键技术：CSS3

作者：盘洪源

撰写时间：2019年2月8日

简单制作出一个简单的伪类事件。首先一开始如下

在这里插入图片描述

然后通过伪类变成这样

在这里插入图片描述

这一个过程其实很简单，上面的基本样式就不多说了，首先要给这个盒子加个伪类，如下图

在这里插入图片描述

伪类中给盒子加上阴影效果，这时候的效果看起来并不是太好，我们再结合CSS3动画然后就可以了

给盒子加上一个动画的时间这样看起来效果比较好点，在盒子里加入这个动画时间即可

在这里插入图片描述

这样一个简单的动画效果就可以实现了。