JS30 Two--js+css Clock

成品：

                                         视频传不上来，，，应该是动态的。。。

 在完成这个练习的过程中，学习到了：

        1.  setInterval(func,delay)

                 func   :    每隔delay秒执行一次

                delay  :    每次延迟的毫秒数

                

              1).在原有固定布局中，指针被固定在9点钟方向，故需 + 90

              2). 获取当前秒数：（sec/60 ) * 360得到秒针转动度数

              3).获取当前小时（时+分）：( hour / 12) * 360 + ( minutes / 60 ) * 30 

                  其中 ： ( hour / 12) * 360 指小时数为12的多少倍（24/12小时制皆可）再乘360得到小                                 时所需要转的度数

                                ( minutes / 60 ) * 30 指分钟数为60的多少倍再乘30（因为每一大格为30°）为                                  分钟所需要转的度数

               4).获取当前分钟（分+秒）：( minutes / 60 ) * 360 + ( seconds / 60 ) * 6 + 90

                   其中 ：  ( seconds / 60 ) * 6 指 1秒转6°

         2.一些新的css

                1). transform-origin

                        更改一个元素变形的原点

                        参数  ：x,y,z

                        关键字：left center right top bottom

                2). transform: rotate()

                        单位 ： deg :   度数，一个圆共360度

                                     turn ：圈，一个圆共1圈，0 ~ 1 表示顺时针旋转百分比 

             grad ： 梯度，一个圆共400梯度             

             rad ： 弧度，一个圆共2π弧度

                3). transition

                    transition-property、

                ​​​​​​​    transition-duration、

        ​​​​​​​        ​​​​​​​    transition-timing-function

        ​​​​​​​        ​​​​​​​   transition-delay                 

                   作用 ： 过渡效果，多个属性之间用逗号进行分隔。

               暂时这些，晚安