CSS星軌旋轉(zhuǎn)是一種在網(wǎng)頁(yè)設(shè)計(jì)中常見的效果，可以讓網(wǎng)頁(yè)看起來更加動(dòng)感和生動(dòng)。實(shí)現(xiàn)這種效果需要運(yùn)用CSS3中的旋轉(zhuǎn)和動(dòng)畫特性。在這里我們將使用pre標(biāo)簽來展示代碼。

/* 定義星軌的樣式 */
.star {
position: absolute;
width: 5px;
height: 5px;
border-radius: 50%;
background: #fff;
}
/* 定義動(dòng)畫的樣式 */
@keyframes rotation {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
/* 定義星軌的動(dòng)畫 */
.star-1 {
top: 20%;
left: 45%;
animation: rotation 20s linear infinite;
}
.star-2 {
top: 45%;
left: 20%;
animation: rotation 25s linear infinite;
}
.star-3 {
top: 75%;
left: 25%;
animation: rotation 30s linear infinite;
}
.star-4 {
top: 65%;
left: 70%;
animation: rotation 35s linear infinite;
}
/* 將星軌添加到頁(yè)面中 */
div {
position: relative;
}

上面的代碼中，我們首先定義了一個(gè).star的樣式，用來表示星軌的形狀和顏色。接著，我們定義了一個(gè)名為rotation的動(dòng)畫樣式，用來表示星軌旋轉(zhuǎn)的效果。最后，我們定義了四個(gè)不同的.star樣式來表示不同位置的星軌，并通過animation屬性將rotation動(dòng)畫應(yīng)用到星軌上。最后將組成好的星軌通過添加到頁(yè)面的div標(biāo)簽中來完成星軌的展示。

當(dāng)頁(yè)面加載完成后，星軌將會(huì)開始旋轉(zhuǎn)，從而創(chuàng)建出一種炫酷的視覺效果。這個(gè)效果可以讓網(wǎng)頁(yè)看起來更富有動(dòng)感，增加用戶的體驗(yàn)感。此外，通過不同的參數(shù)設(shè)置，還可以創(chuàng)造出多種不同的星軌效果，讓網(wǎng)頁(yè)更具生命力。