* {
margin:0;
padding:0;
background-color:rgb(255,255,255);
}
@media screen and (min-width:width 0px) and (max-width:1000px) {
/* 手机,平板等需要横屏加载 */
}
#playground {
margin:20px auto;
width:600px;
height:400px;
border:solid rgb(209,209,209) 1px;
border-radius:10px;
position:relative;
background-color:rgb(248,251,252);
}
#snake {
width:20px;
height:20px;
position:absolute;
background-color:black;
top:100px;
left:100px;
border-radius:50%;
}
#foods {
background-color:blue;
width:20px;
height:20px;
position:absolute;
top:300px;
left:300px;
border-radius:50%;
}
.body {
width:20px;
height:20px;
position:absolute;
background-color:rgb(119,119,119);
border-radius:50%;
}
p {
text-align:center;
background:transparent;
z-index:10;
position:relative;
}
div p {
top:-30px;
}
.container {
text-align:center;
}
div.container div#scores,div.container div#playground {
display:inline-block;
}
.background {
margin:0 auto;
width:350px;
height:35px;
background-color:black;
opacity:10%;
border-radius:0 0 20px 20px;
z-index:9;
}
span {
background:transparent;
}
#scores {
top:-20px;
width:200px;
height:400px;
position:relative;
margin-right:20px;
background-color:rgb(237,243,245);
border:solid rgb(209,209,209) 1px;
border-radius:10px;
left:30px;
opacity:.7;
}
.title {
margin:4px;
margin-bottom:10px;
margin-top:10px;
line-height:30px;
font-weight:bold;
background-color:transparent;
text-align:center;
border-radius:10px;
}
.score {
position:relative;
overflow:hidden;
margin:4px;
width:96%;
height:30px;
float:left;
border-radius:10px;
}
.scorespan {
position:relative;
top:5px;
left:90px;
float:left;
}
.score div.gametime {
position:relative;
float:right;
line-height:12px;
font-size:12px;
top:18px;
color:rgb(104,117,121);
width:70px;
height:12px;
}
更新时间:2020-12-07 01:41:01
wsad操作,