Gluttonous Snake.css

标签：absolute   play   col   index   lin   art   contain   rgba   nta   

/*最外层的盒子*/
.container{
width: 640px;
height: 640px;
/*盒子居中*/
margin: 100px auto;
/*相对定位*/
position: relative;
}
/*两个按钮*/
.btn{
width: 100%;
height: 100%;
/*绝对定位*/
position: absolute;
left: 0;
top: 0;
background-color: rgba(0,0,0,.3);
/*使它放在蛇和食物上*/
z-index: 2;
}
.btn button{
background: none;
/*去边框*/
border: none;
outline: none;
cursor: pointer;
position: absolute;
left: 50%;
top: 50%;
background-size:100%,100% ;
}
.starBtn button{
width: 200px;
height: 90px;
background-image: url(../img/start.png);
margin-left: -100px;
margin-top: -45px;
}
/*隐藏暂停按钮*/
.pauseBtn{
display: none;
}
.pauseBtn button{
width: 70px;
height: 70px;
background-image: url(../img/stop.png);
margin-left: -35px;
margin-top: -35px;
}
#snakeWarp{
width: 600px;
height: 600px;
/*background:lightcyan aqua;*/
background-image: linear-gradient(lightcyan,aqua);
border: 20px solid peru;
position: relative;
}
/*#snakeWarp div{
width: 20px;
height: 20px;
}*/
.snakeHead{
/*background: url();
background-size:cover;*/
background-color:blue ;
}
.snakeBody{
background-color: black;
border-radius: 50%;
}
.food{
/*background: url();
background-size:cover;*/
background-color:greenyellow;

}

Gluttonous Snake.css

标签：absolute   play   col   index   lin   art   contain   rgba   nta   

原文地址：https://www.cnblogs.com/weixin2623670713/p/13399312.html