CSS3可以很方便地設(shè)置桃心形狀，只需要使用偽元素before和after以及transform屬性就可以了。

.heart {
position: relative;
width: 20px;
height: 20px;
transform: rotate(45deg);
}
.heart:before,
.heart:after {
content: '';
position: absolute;
width: 14px;
height: 14px;
border-radius: 50%;
background-color: #FF69B4;
}
.heart:before {
left: -5px;
top: 0;
}
.heart:after {
left: 0;
top: -5px;
}

以上的CSS代碼就能夠?qū)崿F(xiàn)一個(gè)不錯(cuò)的桃心形狀，代碼中主要的部分就是設(shè)置before和after的內(nèi)容，分別用于創(chuàng)建桃心的兩個(gè)半邊。

其中transform: rotate(45deg);旋轉(zhuǎn)這個(gè)桃心，否則它就只是一個(gè)紅色的方塊。

背景顏色可以根據(jù)自己喜好進(jìn)行修改，同時(shí)也可以修改桃心的大小。