css机械时钟

要点:
1.外面的div的transform-origin改变并加上了旋转后,内面的div的布局也会相应改变,但内部的div的transform-origin不会继承祖先的(默认还是自己的中心点),同时平移的方向会根据祖先元素的旋转而相应改变(为什么在例子中要在所有的点外面套一个div?)

2.同一个div的transform属性只能有一个,多个属性要连着写,否则后写的回覆盖前面的

3.transform的两个属性的先后顺序是有区别的,平移后旋转和旋转后平移效果不同(时钟的刻度套先旋转,再沿着x轴方向平移r的距离)





  
  
  Document




  

你可能感兴趣的:(css机械时钟)