使用偽元素實現
使用一個div
1 <div class="heart-shape"></div>
css樣式設置
1 .heart-shape{position:relative;width:30px;height:30px;background-color:red;border-radius:3px;transform:rotate(45deg);top:50%;left:50%;margin:-15px;} 2 .heart-shape:before{content:'';position:absolute;width:30px;height:30px;background-color:red;border-radius:50%;top:0px;left:-15px;} 3 .heart-shape:after{position:absolute;width:30px;height:30px;content:'';background-color:red;border-radius:50%;left:0px;top:-15px;}