效果图:
代码:
**css部分:**
body {
padding: 100px;
}
span {
display: inline-block;
}
.heart-left, .heart-right {
width: 50px; height: 80px; background-color: red;
border-top-left-radius: 25px;
border-top-right-radius: 25px;
}
.heart-left {
transform: rotateZ(-45deg);
}
.heart-right {
transform: translateX(-28px) rotateZ(45deg);
}
.heart {
animation: beat 1.5s infinite;
}
@keyframes beat {
30% { transform: scale(1.3); }
100% { transform: scale(1); }
}
html部分:
<span class="heart">
<span class="heart-left"></span>
<span class="heart-right"></span>
</span>
各位大虾手下留情 刚学有错多多包涵!