CSS是前端開發中不可或缺的一部分，可以實現很多炫酷的效果。其中，開紅包金幣旋轉效果可以為網頁增添一份喜慶的氣氛。

/* 定義旋轉動畫 */
@keyframes rotate {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/* 定義紅包和金幣樣式 */
.red-envelope {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100px;
height: 100px;
background: red;
border-radius: 50%;
box-shadow: 0 0 20px rgba(255, 0, 0, 0.8);
animation: rotate 2s linear infinite;
}
.gold-coin {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 30px;
height: 30px;
background: #f5d847;
border-radius: 50%;
box-shadow: 0 0 20px rgba(245, 216, 71, 0.8);
animation: rotate 2s linear infinite reverse;
}
/* 頁面結構 */

以上代碼實現了開紅包金幣旋轉效果，紅包和金幣使用絕對定位在頁面中間展示，rotate動畫用來旋轉元素，可通過調整from和to的值改變旋轉角度。

紅包使用紅色背景和紅色陰影實現，金幣使用黃色背景和黃色陰影實現，同時讓金幣的旋轉方向與紅包相反，使整個效果更加生動。