初学js 自制表盘时钟很简单

学习前端没一周，用简单的HTML 和css js 做的

* {
    margin: 0;
    padding: 0;
}
#wrap {
    position: relative;
    width: 300px;
    height: 300px;
    background: #09F;
    text-align: center;
    margin: 0 auto;
    border-radius: 150px;
}
.a1 {
    display: block;
    width: 300px;
    height: 5px;
    transform: rotate(0deg);
    position: absolute;
    top: 147px;
    left: 0px;
}
.left {
    display: block;
    float: left;
    width: 20px;
    height: 5px;
    background: #9F3;
}
.right {
    display: block;
    float: right;
    width: 20px;
    height: 5px;
    background: #9F3;
}
.po {
    width: 20px;
    height: 20px;
    background: #000;
    border-radius: 10px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -10px 0 0 -10px;
    z-index:99;
}
#mz {
    height: 300px;
    width: 5px;
    transform: rotate(0deg);
    position: absolute;
    top: 0px;
    left: 149px;
    z-index:80;

}
.mz {
    width: 5px;
    height:155px;
    margin:  45px 0 100px 0;
    background: #60F;
}
#fz {
    width: 7px;
    height: 300px;
    transform: rotate(0deg);
    position: absolute;
    top: 0px;
    left: 148px;
    z-index:10;
}
.fz {
    width: 7px;
    height: 135px;
    margin:  55px 0 110px 0;
    background:#00F;
}
#sz {
    width: 10px;
    height: 300px;
    transform: rotate(0deg);
    position: absolute;
    top: 0px;
    left: 145px;
    z-index:5;
}
.sz {
    width: 10px;
    height: 110px;
    margin: 70px 0 120px 0;
    background:#9F9;
}