CSS三維球體是通過使用CSS3中的transform屬性和過渡效果來創建的美觀的球體。利用這些屬性，可以讓球體在網頁中產生生動的動畫效果。

/* 創建球體的基本樣式 */
.ball {
width: 100px;
height: 100px;
background-color: red;
border-radius: 50%;
position: relative;
transform-style: preserve-3d;
}
/* 添加球體陰影效果 */
.ball::after {
content: "";
position: absolute;
left: 10px;
top: 10px;
width: 80px;
height: 80px;
background-color: rgba(0, 0, 0, 0.5);
border-radius: 50%;
transform: translateZ(-1px);
}
/* 制作球體的過渡動畫效果 */
.ball:hover {
transform: rotateX(360deg) rotateY(360deg);
transition: transform 2s;
}

以上CSS代碼中，基本樣式使用border-radius屬性和寬度、高度設置為100px來實現球體的形狀。position屬性的值設置為relative，以便后續添加陰影效果以及制作動畫效果。transform-style屬性的值設置為preserve-3d，以便后續創建3D動畫效果。陰影效果使用偽元素::after在球體上疊加一個陰影層，利用了CSS3中的translateZ屬性。

最后，添加球體的過渡動畫效果。當鼠標懸停在球體上時，利用rotateX和rotateY屬性制作旋轉動畫效果，并使用transition屬性設置變化的時間為2秒。