近年來，紅包已經成為了各大社交媒體平臺必備的功能。最初的紅包只有金額和文字內容，接下來又加入了顏色和動畫等效果。而在 CSS3 的加持下，紅包效果得到了更大的提升。

.red-envelope{
background-color: #ff5252;
border-radius: 50%;
width: 80px;
height: 80px;
position: relative;
cursor: pointer;
animation: envelope 1s infinite;
}
.red-envelope::before{
content: "";
background: linear-gradient(to bottom right, #ff5252, #ff4242);
border-radius: 50%;
width: 70px;
height: 70px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: -1;
}
@keyframes envelope {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}

以上代碼是一個實現紅包效果的 CSS3 樣式。首先，紅包的背景顏色和半徑使用了 border-radius 屬性，同時設置了紅包的寬高，并且設置了光標的樣式。

接下來我們添加一個大紅色的圓圈，它被放置在屏幕中間，紅包正是放在這個圓圈上。使用 ::before 選擇器，設置紅色圓圈并使用漸變色來讓它看起來更加真實。然后通過 transform 屬性，使其水平垂直居中，使得放在它上面的紅包更加美觀。

最后是動畫部分，通過設置 @keyframes 的 from 和 to 屬性，實現紅包的大小變化效果，使用戶在使用紅包時更加有視覺效果和愉悅感。

總之，紅包是一項非常流行的功能，它的成功和用戶體驗的改善密不可分。在 CSS3 的加持下，我們能夠實現更加多彩、豐富的紅包效果，進一步提升用戶體驗，讓紅包這種功能變得更加有趣、有活力。