CSS動態星空背景是一種很酷的設計，它可以為網站增加視覺吸引力，并增強用戶體驗。下面我們來介紹一下如何實現CSS動態星空背景。

/* CSS代碼 */
body {
background: #000;
}
.stars {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: -1;
}
.stars:after {
content: '';
display: block;
position: absolute;
top: -200px;
left: -200px;
bottom: -200px;
right: -200px;
z-index: -1;
background-image: radial-gradient(circle, #fff 10%, rgba(255, 255, 255, 0) 70%);
background-position: center;
background-repeat: repeat;
animation: shimmer 2s infinite linear;
}
@keyframes shimmer {
0% {
transform: translate3d(0, 0, 0);
}
100% {
transform: translate3d(200px, 200px, 0);
}
}
.star {
position: absolute;
width: 2px;
height: 2px;
background: #fff;
border-radius: 50%;
animation: twinkling 4s infinite;
}
@keyframes twinkling {
0% {
transform: scale(1);
opacity: 1;
}
50% {
transform: scale(0);
opacity: 0.5;
}
100% {
transform: scale(1);
opacity: 1;
}
}

首先，我們設置了頁面的背景顏色為黑色。然后，我們創建了一個.stars容器，并將其移動到頁面的最下層。

接下來，我們在.stars:after中創建一個圓形徑向漸變背景。這個背景會讓星星看起來閃爍不停。

最后，我們創建了.star類，給它設置了隨機的位置和動畫效果。這個類可以隨機生成星星，并在頁面上閃爍不停。

這里的關鍵在于我們使用了 CSS 動畫效果，實現了星空中星星閃爍的效果。我們使用 CSS Animation 屬性來控制星星的運動，并使用 Transform 命令來讓星星隨機出現在頁面上。

總之，CSS動態星空背景是一個非常酷的設計，可以讓你的網站更加有吸引力，為你的用戶提供更好的用戶體驗。希望本文能對你有所幫助，并為你的網站帶來很多好評！