時鐘旋轉是一種比較常見的效果，它可以使一個時鐘看起來更加生動、鮮活。在CSS中，我們可以使用transform屬性來實現時鐘旋轉效果。

.clock {
position: relative;
width: 200px;
height: 200px;
margin: 0 auto;
}
.hour, .minute, .second {
position: absolute;
top: 50%;
left: 50%;
width: 5px;
height: 50px;
background-color: #333;
transform-origin: bottom center;
transform: translate(-50%, -100%);
}
.hour {
height: 40px;
width: 8px;
background-color: #555;
transform-origin: bottom center;
}

以上是HTML和CSS的基礎代碼，我們可以看到，時鐘的整體由包含類名為.clock的div來構成，而div中的子元素為時針、分針、秒針，分別使用類名.hour、.minute、.second來表示。這三個子元素都是絕對定位，且其transform-origin屬性設置為bottom center，也就是以底部為起點進行旋轉。

function clock() {
var d = new Date();
var h = d.getHours();
var m = d.getMinutes();
var s = d.getSeconds();
var hour = document.querySelector('.hour');
var minute = document.querySelector('.minute');
var second = document.querySelector('.second');
var hDeg = h * 30 + m * 0.5;
var mDeg = m * 6;
var sDeg = s * 6;
hour.style.transform = 'rotate(' + hDeg + 'deg)';
minute.style.transform = 'rotate(' + mDeg + 'deg)';
second.style.transform = 'rotate(' + sDeg + 'deg)';
setTimeout(clock, 1000);
}
clock();

以上是時鐘的JavaScript代碼，它實現了獲取當前時間，并計算出時針、分針、秒針的旋轉角度。最后，使用style.transform屬性來設置三個子元素的旋轉角度。

最后，我們可以在頁面中引入以上HTML、CSS和JS的代碼，來實現一個簡單的時鐘旋轉效果，具體效果可參見預覽：