时间与我们的生活密不可分,下面我将用css来实现一个简单的时钟,并且实现其功能
时钟主要分为两个部分,一个是four的表盘部分,一个为five的指针部分,six为表中心的一个小黑点,接下来开始样式的编写
首先,four表盘的样式,完成效果如下,想要多一些针可以自行添加
具体代码如下:
.four{
width: 200px;
height: 200px;
border-radius: 50%;
border: 1px solid #060606;
margin: 240px auto;
}
.four p{
width: 100px;
height: 1px;
background: #000000;
display: block;
}
.four p:first-child{
margin-top: 100px;
transform: rotate(90deg);
transform-origin:right;
}
.four p:nth-child(2){
transform: rotate(180deg);
transform-origin:right;
}
.four p:nth-child