这是一个使用 CSS 实现网页烟花特效的例子：
/* 给烟花容器设置样式 */.fireworks {position: relative;height: 100vh;overflow: hidden;background: black;}/* 烟花爆炸效果 */.fireworks::before,.fireworks::after {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-image: radial-gradient(circle, #fff, transparent);border-radius: 50%;animation: explode 0.5s linear both;pointer-events: none;}.fireworks::after {animation-delay: 0.25s;}/* 烟花动画 */@keyframes explode {to {transform: scale(1.5);opacity: 0;}}/* 烟花 */.firework {position: absolute;top: -10px;left: 50%;width: 10px;height: 10px;background: #fff;border-radius: 50%;transform: translateX(-50%);animation: shoot 1s linear both;}/* 烟花动画 */@keyframes shoot {0% {transform: translateY(-100vh) translateX(-50%);}25% {transform: translateY(-50vh) translateX(-50%) rotate(180deg);}50% {transform: translateY(0) translateX(-50%) rotate(360deg);}75% {transform: translateY(-50vh) translateX(-50%) rotate(540deg);}100% {transform: translateY(-100vh) translateX(-50%);}}
