CSS爱心动画，即使用CSS3技术制作的动态爱心效果。这种动画效果通常用于节日祝福、情人节表白等场合。
/* 关键帧动画 */
@keyframes love {
0% {
transform: scale(1);
}
50% {
transform: scale(1.2);
}
100% {
transform: scale(1);
}
}
/* 爱心图形 */
.love {
width: 80px;
height: 80px;
margin: 100px auto 0;
position: relative;
}
.love .heart {
position: absolute;
width: 40px;
height: 40px;
background: red;
transform: rotate(45deg);
border-radius: 50% 50% 0 0;
top: 0;
left: 20px;
animation: love 1s linear infinite;
}
.love .heart:after,
.love .heart:before {
content: "";
position: absolute;
background: red;
}
.love .heart:before {
width: 40px;
height: 40px;
top: -20px;
left: 0;
border-radius: 50% 50% 0 0;
}
.love .heart:after {
width: 40px;
height: 40px;
top: 0;
left: -20px;
border-radius: 50% 50% 0 0;
}
通过CSS3的关键帧动画，定义一个心形图形，并加上一些额外的效果，最终形成了一个具有强烈节日气氛的爱心动画。你可以在HTML中添加一个div元素，并加上类名love，即可以在网页上看到这个爱心动画的效果。
