在 CSS 中，可以使用 transform 屬性來(lái)設(shè)置元素的三維效果。transform 屬性提供了一系列的函數(shù)可以用來(lái)轉(zhuǎn)換元素的位置，大小和形狀。

.box {
transform: translateX(50px) translateY(50px) translateZ(50px);
}

上面的代碼將元素向X、Y和Z軸平移了50像素。也可以通過 rotateX，rotateY 和 rotateZ 函數(shù)來(lái)旋轉(zhuǎn)元素：

.box {
transform: rotateX(45deg) rotateY(45deg) rotateZ(45deg);
}

上面的代碼將元素繞 X,Y 和 Z 軸旋轉(zhuǎn)了 45 度。此外，還可以使用 perspective 函數(shù)來(lái)設(shè)置透視視角：

.container {
perspective: 600px;
}
.box {
transform: rotateY(45deg);
}

上面的代碼中，.container 元素被設(shè)置了透視視角。.box 元素繞 Y 軸旋轉(zhuǎn)了 45 度，但由于 .container 元素有透視視角，所以看起來(lái)更加立體。

在設(shè)置三維效果時(shí)，需要注意的是，當(dāng)元素旋轉(zhuǎn)時(shí)，其內(nèi)容也會(huì)旋轉(zhuǎn)。如果不想看到內(nèi)容旋轉(zhuǎn)可以使用 backface-visibility 屬性來(lái)設(shè)置隱藏后面的面：

.box {
transform: rotateY(45deg);
backface-visibility: hidden;
}

上面的代碼將元素繞 Y 軸旋轉(zhuǎn)了 45 度，而且后面的面也被隱藏了。