在CSS中，我們可以使用transform屬性來實現(xiàn)3D旋轉(zhuǎn)效果。在一個元素上使用transform: rotateX/Y/Z(deg)可以分別按照X/Y/Z軸旋轉(zhuǎn)元素。

transform: rotateX(40deg);
transform: rotateY(60deg);
transform: rotateZ(80deg);

其中deg是度數(shù)，表示要旋轉(zhuǎn)的角度。此外，還可以使用translate3d(x,y,z)來實現(xiàn)元素在x/y/z軸上的3D移動。例如：

transform: translate3d(100px, 50px, 0);

上述代碼將元素在X軸上向右移動100px，在Y軸上向下移動50px。

當然，如果要實現(xiàn)復雜的翻轉(zhuǎn)或旋轉(zhuǎn)效果，我們需要使用perspective屬性來指定視距。視距越大，則相應的元素越小，視覺效果越逼真。

.container {
perspective: 1000px;
}
.box {
transform-style: preserve-3d;
transition: transform 1s ease;
}
.box:hover {
transform: rotateY(180deg);
}

上述代碼實現(xiàn)了當鼠標懸浮在.box元素上時，其向左右翻轉(zhuǎn)180度的效果。其中，preserve-3d表示父元素也需要保持3D式布局，而transition屬性則指定了變換過渡的時間和方式。需要注意的是，transform-style默認為flat，即所有子元素平面布局，若要實現(xiàn)3D布局，則需要設(shè)為preserve-3d。