CSS3 時鐘是一種利用 CSS3 技術制作的時鐘，可以通過 CSS3 中的 transform 屬性來實現(xiàn) 3D 效果。下面展示一個用 CSS3 編寫的時鐘，它可以通過一些簡單的 CSS33 代碼來呈現(xiàn)出非常炫酷的效果。

.clock {
position: relative;
width: 200px; 
height: 200px; 
margin: 0 auto; 
border-radius: 50%; 
background: #eee;
}
.hour, .minute, .second {
position: absolute;
width: 6px;
height: 6px;
border-radius: 50%;
}
.hour {
background: #888; 
top: 97px; 
left: 97px; 
}
.minute {
background: #555; 
top: 92px; 
left: 97px;
}
.second {
background: #f00; 
top: 90px; 
left: 97px;
}
.marker {
position: absolute;
width: 2px;
height: 10px;
background: #000;
top: 40px;
left: 99px;
transform-origin: bottom center;
animation: rotate 60s steps(60) infinite;
}
@keyframes rotate {
100% {
transform: rotate(360deg);
}
}

可以看到，在代碼中設置了一個以鐘表中心點為圓心的圓形表盤，表盤分為小時刻度和分鐘刻度。時針、分針和秒針分別使用 CSS3 中的偽元素定位于表盤上，旋轉效果利用 CSS3 中的 transform 屬性實現(xiàn)。

同時，我們通過 animation 屬性為“刻度”設置旋轉動畫，并使用 transform-origin 屬性設置旋轉中心點，實現(xiàn)了刻度在表盤上按順時針方向不停旋轉。

CSS3 時鐘雖然不是一個實用的功能，但它對于我們學習 CSS3 的動畫效果和 transform 屬性有很大的幫助。