2048.css

/* 通用样式 */
*{
	margin:0;
	padding:0;

}

div,p,h1,h2,a,span{
	font-family:Arial;
	font-weight:bold;
	text-decoration:none;
}

/* 头部标题 */

header{
	padding-top:16px;
}

h1{
	text-align:center;
}

/* 游戏面板 */
#gamePanel{
	width:500px;
	margin:0 auto;
	position:relative;
}

#gridePanel{
	width:480px;
	height:480px;
	background:#BBADA0;
	border-radius:10px;
	padding:20px 0 0 20px;
	position:relative;

}

#gamePanel p{
	padding:8px;
}


/* 按钮样式 */
.button{
	display:inline-block;
	padding:10px;
	background-color:#9F8B77;
	border-radius:6px;
	color:#fff;
	cursor:pointer;
}

.grid,.cell{
	width:100px;
	height:100px;
	border-radius:6px;
}

.grid{
	background-color:#ccc0b3;
	float:left;
	margin:0 20px 20px 0;
}

/* 格式化单元格 */

.cell{
	color:#776E65;
	position:absolute;
	text-align:center;
	font-size:40px;
	line-height:100px;

}

/* 定义行位置 */
#cell00,#cell01,#cell02,#cell03{
	top:20px;
}
#cell10,#cell11,#cell12,#cell13{
	top:140px;
}
#cell20,#cell21,#cell22,#cell23{
	top:260px;
}
#cell30,#cell31,#cell32,#cell33{
	top:380px;
}

/* 列定位 */

#cell00,#cell10,#cell20,#cell30{
	left:20px;
}
#cell01,#cell11,#cell21,#cell31{
	left:140px;
}
#cell02,#cell12,#cell22,#cell32{
	left:260px;
}
#cell03,#cell13,#cell23,#cell33{
	left:380px;
}

/* 数字的显示效果 */
	/* 除了2、4均为白色 */
.num8,.num16,.num32,.num64,.num128,.num256,.num512,.num1024,.num2048,.num4096,.num8192{
	color:#fff;
}

.num2{
	background:#eee4da;
}
.num4{
	background:#ede0c8;
}
.num8{
	background:#f2b179;
}
.num16{
	background:#f59563;
}
.num32{
	background:#f67c5f;
}
.num64{
	background:#f65e3b;
}
.num128{
	background:#edcf72;
}
.num256{
	background:#edcc61;
}
.num512{
	background:#9c0;
}
.num1024{
	background:#33b5e5;
}
.num2048{
	background:#09c;
}
.num4096{
	background:#a6c;
}
.num8192{
	background:#93c;
}

/* GameOver样式 */
#gameOver{

	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
	background:rgba(85,85,85,0.5);
}
#gameOver p{
	background-color:#fff;
	border-radius:10px;
	width:300px;
	position:absolute;
	left:100px;
	top:200px;
	font-size:30px;
	line-height:1.5em;
	text-align:center;
	padding-bottom:20px;
}