用CSS制作的时钟箭头工作不正确

I have made an analog clock using CSS and rotate its arrows. This works fine but the problem appears when I set starting time. for example, if it's 12:00pm, second arrow does full spin in 60 seconds, minute arrow does the same in 3600 seconds and hour hand does it in 43200 seconds. But, if the time is 3:15:20pm, second arrow should start moving from 20 seconds. In this case I use and rotat