在網頁設計中，使用CSS制作愛心是一種十分常見的效果。下面我們來學習如何利用CSS實現一個可愛的愛心吧！

.heart {
width: 60px; /* 愛心的寬 */
height: 60px; /* 愛心的高 */
position: relative; /* 相對定位 */
display: inline-block;
}
.heart:before,
.heart:after {
content: ""; /* ::before和::after偽元素 */
position: absolute;
left: 30px; /* 兩顆心形狀的定位 */
top: 0;
width: 30px;
height: 45px;
background: #fc2e51; /* 愛心顏色 */
border-radius: 30px 30px 0 0; /* 邊角弧度 */
transform: rotate(-45deg); /* 傾斜度 */
transform-origin: 0 100%; /* 變換基點 */
}
.heart:after {
left: 0; /* 反轉位置 */
transform: rotate(45deg);
transform-origin: 100% 100%;
}

上面的代碼首先創建了一個容器，用來裝我們的愛心。通過偽元素實現了兩個三角形組合成一個愛心的形狀，然后通過旋轉和定位達到完美的效果。

現在只需要在HTML中使用這個樣式：

<div class="heart"></div>

就會得到一個可愛的小愛心了！如果你想讓愛心更大一點，只需要調整一下`.heart`的`width`和`height`屬性即可。

上面是利用CSS制作一個愛心的方法，希望對大家有幫助。