CSS3旋轉木馬是一種非常流行的網頁特效，可以讓您的網頁看起來更加動態和有趣。下面我們來看看如何手工制作CSS3旋轉木馬：

html{
font-family: Arial, sans-serif;
font-size: 16px;
}
.wrapper{
width: 800px;
margin: 0 auto;
}
.carousel{
position: relative;
perspective: 1000px;
transform-style: preserve-3d;
height: 300px;
}
.carousel .item{
position: absolute;
width: 400px;
height: 200px;
background-color: #fff;
color: #333;
font-size: 2rem;
text-align: center;
box-shadow: 0px 0px 20px rgba(0,0,0,0.3);
border-radius: 10px;
opacity: 0.3;
cursor: pointer;
transition: all 0.3s ease;
}
.carousel .item.active{
opacity: 1;
transform: rotateY(0deg) translateZ(150px);
}
.carousel .item.prev{
opacity: 0.7;
transform: rotateY(-60deg) translateZ(150px);
}
.carousel .item.next{
opacity: 0.7;
transform: rotateY(60deg) translateZ(150px);
}

上面的代碼中，我們首先定義了一些基本的樣式，包括字體、字號和外觀等。然后，在.carousel 和 .item 類中，我們設置了旋轉木馬整體和每個旋轉木馬項目的樣式。我們使用 position:relative、perspective 和 transform-style 屬性，將旋轉木馬固定在頁面上，并讓它可以產生 3D 效果。

我們給每個 .item 添加了不同的狀態，包括 active、prev 和 next。它們分別代表當前激活的項目、前一個項目和下一個項目。我們使用 transform 屬性和 rotateY() 函數，將它們分別轉動到不同的角度，并使用 translateZ() 函數將它們移動和縮放。

接下來，我們需要使用 JavaScript 或 jQuery 來控制旋轉木馬的動畫效果。我們可以使用 addClass() 和 removeClass() 函數來控制每個 .item 的狀態，并在它們之間切換。我們還可以使用 setInterval() 函數來定時調用這些函數，實現自動播放功能。