在網頁設計中，我們經常會用到CSS來控制頁面的布局和樣式。而如果我們想要實現一些有趣的效果，比如用CSS來畫出一個行星，該怎么做呢？

/* 首先，我們需要設置行星的基本屬性 */
.planet {
width: 100px; /* 行星直徑 */
height: 100px;
border-radius: 50%; /* 圓形 */
background-color: #f3b13e; /* 行星顏色 */
position: relative;
}
/* 接著，我們為行星添加一個衛星 */
.planet::before {
content: ""; /* 偽元素內容為空 */
width: 20px; /* 衛星直徑 */
height: 20px;
border-radius: 50%; /* 圓形 */
background-color: #7195c5; /* 衛星顏色 */
position: absolute;
top: -45px; /* 衛星距離行星頂部的距離 */
left: calc(50% - 10px); /* 衛星距離行星左側的距離 */
}
/* 最后，我們為衛星添加一個動畫效果 */
.planet::before {
animation: rotate 5s linear infinite;
}
/* 定義動畫效果 */
@keyframes rotate {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}

這樣，我們就完成了一個簡單的CSS行星效果。當然，除了上面的基本屬性，我們還可以根據需求添加更多的樣式屬性來定制行星的外觀和動畫效果，比如改變行星的顏色、添加多個衛星等。