body {
margin:0px;
background:#FFF;
}
.clock {
width:600px;
height:600px;
background:#000;
margin:50px auto;
-moz-border-radius:300px;
-webkit-border-radius:300px;
border-radius:300px;
-moz-box-shadow:5px 5px 8px #999;
-webkit-box-shadow:5px 5px 8px #999;
box-shadow:5px 5px 8px #999;
}
.clock_bg {
width:600px;
height:500px;
background:#000;
-moz-border-radius:300px;
-webkit-border-radius:300px;
border-radius:300px;
-moz-box-shadow:5px 5px 8px #999 inset;
-webkit-box-shadow:5px 5px 8px #999 inset;
box-shadow:5px 5px 8px #999 inset;
padding:50px 0px;
}
.clock_nr1 {
width:500px;
height:500px;
background:#DEDEDE;
margin:0px auto;
-moz-border-radius:250px;
-webkit-border-radius:250px;
border-radius:250px;
-moz-box-shadow:3px 3px 5px #999;
-webkit-box-shadow:3px 3px 5px #999;
box-shadow:3px 3px 5px #999;
}
.clock_nr2 {
width:500px;
height:500px;
background:#DEDEDE;
-moz-border-radius:250px;
-webkit-border-radius:250px;
border-radius:250px;
-moz-box-shadow:5px 5px 8px #999 inset;
-webkit-box-shadow:5px 5px 8px #999 inset;
box-shadow:5px 5px 8px #999 inset;
position:relative;
}
.spot {
position:absolute;
top:50%;
left:50%;
width:2px;
height:490px;
margin:-245px auto auto -1px;
}
.spot span {
display:block;
width:2px;
height:15px;
background:#444;
position:absolute;
display:block;
}
.spot .span {
display:block;
width:4px;
height:30px;
background:#444;
position:absolute;
margin-left:-1px;
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
}
.spot1 {
position:absolute;
top:50%;
left:50%;
width:20px;
height:300px;
margin:-150px auto auto -10px;
display:inline-block;
}
.spot1 div {
width:20px;
height:160px;
background:#000;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
}
.spot2 {
position:absolute;
top:50%;
left:50%;
width:16px;
height:400px;
margin:-200px auto auto -8px;
}
.spot2 .div1 {
width:8px;
height:100px;
background:#000;
-moz-border-radius:4px 4px 0px 0px;
-webkit-border-radius:4px 4px 0px 0px;
border-radius:4px 4px 0px 0px;
margin:0px auto;
}
.spot2 .div2 {
width:16px;
height:20px;
background:#000;
-moz-border-radius:5px 5px 3px 3px;
-webkit-border-radius:5px 5px 3px 3px;
border-radius:5px 5px 3px 3px;
}
.spot2 .div3 {
width:12px;
height:80px;
background:#000;
-moz-border-radius:3px 3px 10px 10px;
-webkit-border-radius:3px 3px 10px 10px;
border-radius:3px 3px 10px 10px;
margin:0px auto;
}
.spot3 {
position:absolute;
top:50%;
left:50%;
width:16px;
height:420px;
margin:-210px auto auto -8px;
}
.spot3 .div1 {
width:6px;
height:260px;
background:#c00;
-moz-border-radius:3px 3px 0px 0px;
-webkit-border-radius:3px 3px 0px 0px;
border-radius:3px 3px 0px 0px;
margin:0px auto;
}
.spot3 .div2 {
width:16px;
height:40px;
background:#c00;
-moz-border-radius:5px 5px 10px 10px;
-webkit-border-radius:5px 5px 10px 10px;
border-radius:5px 5px 10px 10px;
}
.spot0 {
position:absolute;
top:50%;
left:50%;
width:20px;
height:20px;
margin:-15px auto auto -15px;
-moz-border-radius:15px;
-webkit-border-radius:15px;
border-radius:15px;
border:5px solid #c00;
background:#8f2c00;
background-image:-moz-linear-gradient(top,#ff4f02,#8f2c00);
/* Firefox */background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#ff4f02),color-stop(1,#8f2c00));
/* Saf4+,Chrome */
}
.clock_nr2 b {
font-size:58px;
color:#4A4A4A;
font-style:italic;
display:block;
width:110px;
}
.clock_nr2 .numeral_1 {
position:absolute;
top:60px;
left:331px;
}
.clock_nr2 .numeral_2 {
position:absolute;
top:132px;
left:392px;
}
.clock_nr2 .numeral_3 {
position:absolute;
top:218px;
left:417px;
}
.clock_nr2 .numeral_4 {
position:absolute;
top:313px;
left:389px;
}
.clock_nr2 .numeral_5 {
position:absolute;
top:381px;
left:326px;
}
.clock_nr2 .numeral_6 {
position:absolute;
top:401px;
left:228px;
}
.clock_nr2 .numeral_7 {
position:absolute;
top:381px;
left:134px;
}
.clock_nr2 .numeral_8 {
position:absolute;
top:313px;
left:69px;
}
.clock_nr2 .numeral_9 {
position:absolute;
top:218px;
left:38px;
}
.clock_nr2 .numeral_10 {
position:absolute;
top:132px;
left:54px;
}
.clock_nr2 .numeral_11 {
position:absolute;
top:60px;
left:120px;
}
.clock_nr2 .numeral_12 {
position:absolute;
top:32px;
left:216px;
}
更新时间:2023-04-26 22:14:41