CSS3 3D旋轉木馬是一種非常流行的網頁特效，可以增加頁面的動態感和趣味性。它利用CSS3的3D轉換功能來實現，通過簡單的CSS代碼就能輕松實現。

/* 設置容器樣式 */
.carousel {
perspective: 1000px; /* 設置透視距離 */
position: relative; /* 設置相對定位，方便后面絕對定位的元素定位 */
}
/* 設置每個子元素的樣式 */
.carousel figure {
display: inline-block; /* 設置元素為內聯塊級元素 */
position: absolute; /* 設置絕對定位，方便元素旋轉時的定位 */
width: 300px; /* 設置寬 */
height: 200px; /* 設置高 */
margin: 0; /* 去除默認外邊距 */
box-shadow: 1px 1px 3px rgba(0,0,0,.3); /* 設置陰影 */
transform-style: preserve-3d; /* 保留元素的3D變換效果 */
}
/* 設置每個子元素的旋轉角度和旋轉軸 */
.carousel figure:nth-child(1) { transform: rotateY(0deg) translateZ(350px); }
.carousel figure:nth-child(2) { transform: rotateY(60deg) translateZ(350px); }
.carousel figure:nth-child(3) { transform: rotateY(120deg) translateZ(350px); }
.carousel figure:nth-child(4) { transform: rotateY(180deg) translateZ(350px); }
.carousel figure:nth-child(5) { transform: rotateY(-120deg) translateZ(350px); }
.carousel figure:nth-child(6) { transform: rotateY(-60deg) translateZ(350px); }
/* 設置鼠標懸停時每個子元素的旋轉角度 */
.carousel:hover figure:nth-child(1) { transform: rotateY(-60deg) translateZ(350px); }
.carousel:hover figure:nth-child(2) { transform: rotateY(0deg) translateZ(350px); }
.carousel:hover figure:nth-child(3) { transform: rotateY(60deg) translateZ(350px); }
.carousel:hover figure:nth-child(4) { transform: rotateY(120deg) translateZ(350px); }
.carousel:hover figure:nth-child(5) { transform: rotateY(180deg) translateZ(350px); }
.carousel:hover figure:nth-child(6) { transform: rotateY(-120deg) translateZ(350px); }

上面的代碼中，首先設置了一個容器.carousel，并通過perspective屬性設置了透視距離，實現了3D效果。接著，通過設置每個子元素的transform-style屬性為preserve-3d，保留元素的3D變換效果。然后，通過transform屬性設置每個子元素的旋轉角度和旋轉軸，實現了旋轉木馬的效果。最后，利用:hover偽類設置鼠標懸停時每個子元素的旋轉角度，增加了交互性。

通過上面的代碼，我們就可以輕松實現一個簡單的CSS3 3D旋轉木馬效果，為我們的網頁增添了更多的動態感和趣味性。