style.css

/**
*
* @Name : ChessDesktop/style.css
* @Version : 1.0
* @Programmer : Max
* @Date : 2019-05-23
* @Released under : https://github.com/BaseMax/ChessDesktop/blob/master/LICENSE
* @Repository : https://github.com/BaseMax/ChessDesktop
*
**/
#table {
	width: 400px;
	height: 400px;
	border: 5px solid black;
}
.row {
	display: inline-block;
}
.column {
	width: 50px;
	height: 50px;
	float: left;
}
.column.white {
	background: blue;
}
.column.black {
	background: green;
}
.column.selected {
	background: yellow;
}
.column.cango {
	background: orange;
}
.piece {
	cursor: pointer;
	text-align: center;
	position: relative;
	width: 50px;
	height: 50px;
	background: transparent;
}
/* Black */
.piece.bishop.black {
	background-image: url('images/black_bishop.svg');
}
.piece.king.black {
	background-image: url('images/black_king.svg');
}
.piece.knight.black {
	background-image: url('images/black_knight.svg');
}
.piece.pawn.black {
	background-image: url('images/black_pawn.svg');
}
.piece.queen.black {
	background-image: url('images/black_queen.svg');
}
.piece.rook.black {
	background-image: url('images/black_rook.svg');
}
/* White */
.piece.bishop.white {
	background-image: url('images/white_bishop.svg');
}
.piece.king.white {
	background-image: url('images/white_king.svg');
}
.piece.knight.white {
	background-image: url('images/white_knight.svg');
}
.piece.pawn.white {
	background-image: url('images/white_pawn.svg');
}
.piece.queen.white {
	background-image: url('images/white_queen.svg');
}
.piece.rook.white {
	background-image: url('images/white_rook.svg');
}