html : <view class="hsert"></view>
<style>
.hsert{
position: relative;
width: 140px;
height: 115px;
}
.hsert::before, .hsert::after{
content: '';
position: absolute;
left: 70px;
top: 0px;
width: 70px;
height: 115px;
background: red;
border-radius: 50px 50px 0 0;
transform: rotate(-45deg);
transform-origin: left bottom;
}
.hsert::after{
left: 0;
transform: rotate(45deg);
transform-origin: right bottom;
}
.hsert{
animation: jump 1s infinite ease-out;
}
@keyframes jump{
0% 60% 75% 90% 100% {
transform: scale(1);
}
15%{
transform: scale(0.6);
}
30%{
transform: scale(1);
}
45%{
transform: scale(0.7);
}
}
</style>