HTML5有許多強大的功能，其中之一就是可以使用CSS3的transform屬性來實現元素的旋轉效果。下面是一個使用HTML5實現的旋轉風車的代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>旋轉風車</title>
<style>
.circle {
width: 100px;
height: 100px;
border-radius: 50%;
background-color: #f00;
transform-origin: 50% 50%;
animation: spin 2s linear infinite;
}
.rectangle {
width: 20px;
height: 80px;
background-color: #0f0;
transform-origin: 50% 100%;
animation: spin 3s linear infinite reverse;
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
</style>
</head>
<body>
<div class="circle">
<div class="rectangle"></div>
</div>
</body>
</html>這段代碼使用了CSS3的transform屬性及其相關的旋轉動畫和變換點設置，創建了一個旋轉風車的效果。其中兩個div元素分別表示風車的圓形和矩形槳葉。通過動畫效果的作用，矩形槳葉既有順時針旋轉的運動，也有逆時針旋轉的運動。這個風車的效果非常酷炫，添加到網頁中可以增加頁面的趣味性。