CSS3 3D骰子是一種利用CSS3技術(shù)實(shí)現(xiàn)的動(dòng)態(tài)骰子效果。通過CSS3中的transform屬性和perspective屬性，可以輕松創(chuàng)建一個(gè)可以旋轉(zhuǎn)和擺放的3D骰子。

.cube {
position: relative;
transform-style: preserve-3d;
transform: rotateX(-45deg) rotateY(45deg);
transition: transform .5s ease-in-out;
perspective: 1000px;
}
.cube  .face {
position: absolute;
width: 100px;
height: 100px;
margin: 0;
background-color: #FFF;
opacity: 0.9;
border-radius: 10px;
box-shadow: 0 0 20px rgba(0,0,0,0.2);
text-align: center;
line-height: 100px;
font-size: 48px;
}
.cube .face:nth-child(1) {
transform: translateZ(50px);
}
.cube .face:nth-child(2) {
transform: rotateY(90deg) translateZ(50px);
}
.cube .face:nth-child(3) {
transform: rotateY(-90deg) translateZ(50px);
}
.cube .face:nth-child(4) {
transform: rotateX(90deg) translateZ(50px);
}
.cube .face:nth-child(5) {
transform: rotateX(-90deg) translateZ(50px);
}
.cube .face:nth-child(6) {
transform: rotateY(180deg) translateZ(50px);
}

以上代碼是實(shí)現(xiàn)3D骰子效果的基本代碼，其中.cube代表骰子，它使用了CSS3中的transform屬性來(lái)旋轉(zhuǎn)和擺放，perspective屬性設(shè)置了透視距離，使得骰子能夠產(chǎn)生立體感。

通過為每個(gè)面添加不同的transform屬性，就能實(shí)現(xiàn)骰子的各個(gè)面的顯示和旋轉(zhuǎn)效果，從而讓骰子呈現(xiàn)出逼真的3D視覺效果。此外，還可以添加過渡（transition）屬性來(lái)讓骰子的顯示和旋轉(zhuǎn)更加平滑。

總之，CSS3 3D骰子是一項(xiàng)基于CSS3技術(shù)的有趣的項(xiàng)目，如果您對(duì)此感興趣，可以結(jié)合實(shí)際應(yīng)用進(jìn)行實(shí)踐和創(chuàng)新。