css做简单的爱心跳动特效
制作爱心跳动特效
设计思路：
- 首先通过一个div来做爱心的主题部分并设置宽高背景色，旋转角度
- 通过对伪元素before和after设置爱心的上半部分
- 用绝对定位设置伪元素的位置
- 通过设置伪元素的圆角边框最终成为爱心的形状
- 通过css动画设置旋转角度，改变大小，最终有跳动的效果
制作过程
1、 首先对div设置宽高背景色，
用margin使它位于屏幕水平居中，可以更好的观察效果
用transform让div旋转45度，daxiao为0.8倍 来做心型的主体部分
用relative相对定位是给后面伪元素作参考用的
第一步的效果如下：
/2、给伪元素设置宽高位置
通过设置圆角边框，绝对定位来改变它的位置最终有一个心的形状
给动画设置名称和过程中旋转的角度，改变的大小
最后给div绑定动画的名字，完成时间，播放次数，爱心跳动的效果就做好了
infinite是指动画无限次播放