CSS頭像3D旋轉是一種很酷炫的效果，它可以讓你的網站顯得更加生動有趣。通過CSS的transform屬性和關鍵幀動畫，我們可以實現一個頭像在三維空間中旋轉的效果。

.avatar {
width: 100px;
height: 100px;
border-radius: 50%;
background-image: url(avatar.png);
background-size: cover;
animation: rotate 5s linear infinite;
}
@keyframes rotate {
from {
transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
}
to {
transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg);
}
}

如上代碼，我們首先定義了一個.avatar類，它表示我們的頭像。通過設置寬度、高度、邊框半徑和背景圖片，我們可以讓頭像顯示出來。

接下來，我們使用keyframes關鍵幀動畫來定義頭像的旋轉效果。通過設置從0deg到360deg的旋轉角度，分別繞X軸、Y軸和Z軸旋轉，我們可以讓頭像在三維空間中旋轉。

最后，我們通過animation屬性將這個動畫應用到.avatar類上，并設置動畫的時長為5秒，動畫效果為線性無限循環。這樣，我們就可以看到一個酷炫的頭像在網頁上旋轉了起來！

總之，CSS頭像3D旋轉是一種很有趣的效果，它可以讓你的網頁變得更加生動有趣。通過簡單的CSS代碼，我們就可以實現一個酷炫的頭像旋轉效果。希望這篇文章對你有所幫助！