思路：利用两个长方形(比例是2:3 | 3:2)可以合成心形，然后利用动画，缩放大小实现心跳（纯代码），效果如下：
<body>
<div></div>
</body>
div{
margin: 200px;
width: 200px;/* 盒子1宽高是2：3 */
height: 300px;
background: rgb(218, 9, 9);
position: relative;
border-radius: 100px 100px 0 0;/* 左上，右上变圆角 */
transform: rotate(-45deg);/* 逆时针旋转45deg放正 */
animation: heartbeat 1s ease 0s infinite normal;/* 调用heart动画 */
}
div::after{
content: "";
display: block;
width: 300px;
height: 200px;
background: rgb(218, 9, 9);
position: absolute;
bottom:;
left:;/* 添加一个盒子，宽高是3:2，然后定位在下面，颜色一样， */
border-radius: 0 100px 100px 0 ;/* 右上，右下变圆角 */
}
@keyframes heartbeat {
/* 声明一个名称为heart的动画 */
0%{
transform: scale(1) rotate(-45deg);/* 注意，前面使用了旋转，这里必须写上，不然会重叠效果 */
}
50%{
transform: scale(1.2) rotate(-45deg);
}
100%{
transform: scale(1) rotate(-45deg);
}
}
当然也有其他的方法制作心形，比如：两个圆 + 正方形，可以看另外一篇园友的文章：心跳 CSS