/*外框*/ #parent { width:1150px; height:600px; border:3px solid black; margin:0px auto; padding:30px; position:relative; top:10px; left:10px; background:#00BFFF; } /*跑圈框*/ #box { width:470px; height:470px; border:2px solid black; padding:10px; position:relative; top:80px; left:60px; background:pink; } /*跑圈div*/ #parent #box div { width:94px; height:94px; border:1px solid black; float:left; margin:10px 10px; top:20px; left:20px; color:red; font-weight:bold; } /*中奖信息框*/ #message { width:500px; height:490px; border:2px solid black; position:relative; top:-415px; left:600px; overflow:hidden; } /*跑圈div定位*/ #parent #box div:nth-of-type(6) { width:210px; height:210px; } #parent #box div:nth-of-type(9) { margin-top:-106px; } /*开始按钮*/ #btn { width:80px; height:80px; position:absolute; top:20px; left:300px; border-radius:50%; background:blue; } /*投币按钮*/ #coins { width:80px; height:80px; position:absolute; top:20px; left:90px; border-radius:50%; background:blue; } /*余额*/ span { position:absolute; left:230px; top:50px; } /*红色div*/ .box { background:blue; } /*透明度:opacity:0.5; */ /*得分div*/ #parent #message div { width:500px; height:490px; border:2px solid black; position:absolute; top:492px; left:-2px; background:pink; } /*右边中奖信息提示框*/ #parent #message div:nth-of-type(1) { color:red; display:none; } #parent #message div:nth-of-type(2) { color:red; display:none; } #parent #message div:nth-of-type(3) { color:red; display:none; } #parent #message div:nth-of-type(4) { color:green; display:none; } #parent #message div:nth-of-type(5) { color:green; display:none; } #parent #message div:nth-of-type(6) { color:black; display:none; } #parent #message div:nth-of-type(7) { color:blue; display:none; } #parent #message div:nth-of-type(8) { color:deepskyblue; display:none; } #parent #message div:nth-of-type(9) { color:black; display:none; } #parent #message div:nth-of-type(10) { color:blue; display:none; } #parent #message div:nth-of-type(11) { color:deepskyblue; display:none; } #parent #message div:nth-of-type(12) { color:black; display:none; } #parent #message div:nth-of-type(13) { color:black; display:none; }
内附详细中文解说,基本每一行代码都有内容功能解答,一目了然,纯Js手打