HTML 3D 旋轉木馬效果是一種非常有趣的特效，它可以給網頁帶來生動、動感的展示效果，非常適合用來展示產品、圖片等。下面是 HTML 3D 旋轉木馬效果的代碼示例：

<!-- HTML 代碼 -->
<div class="carousel">
<div class="item">
<img src="image1.jpg">
</div>
<div class="item">
<img src="image2.jpg">
</div>
<div class="item">
<img src="image3.jpg">
</div>
<div class="item">
<img src="image4.jpg">
</div>
</div>
<!-- CSS 代碼 -->
.carousel{
position: relative;
width: 800px;
height: 400px;
border: 1px solid #ccc;
perspective: 1000px;
}
.item{
position: absolute;
width: 400px;
height: 400px;
left: 200px;
top: 0;
transform-style: preserve-3d;
transform-origin: 50% 50% -200px;
transition: transform 1s;
}
.item:nth-child(1){
transform: rotateY(0deg);
}
.item:nth-child(2){
transform: rotateY(90deg);
}
.item:nth-child(3){
transform: rotateY(180deg);
}
.item:nth-child(4){
transform: rotateY(270deg);
}
.carousel:hover .item{
transform: rotateY(45deg);
}

該代碼中，首先在 HTML 代碼中定義了一個名為 "carousel" 的 DIV 元素作為容器，并在其中添加了四個名為 "item" 的 DIV 元素，每個元素包含一張圖片。通過 CSS 樣式表對容器和元素進行設置，定義容器的寬度、高度、邊框和透視屬性，以及定義元素的寬度、高度、位置、3D 變形屬性和過渡效果等。通過下面這段代碼實現了旋轉木馬的效果： .carousel:hover .item{ transform: rotateY(45deg); } 當鼠標移入容器元素時，通過 CSS 樣式表的 hover 屬性，將元素沿 Y 軸旋轉 45 度，實現旋轉木馬的動畫效果。通過該代碼示例，可以輕松實現 HTML 3D 旋轉木馬效果，并運用到網站中進行展示。