robinli/CSS3 Zebra striping table

## CSS3 Zebra striping table
<html>
<head>
<style type='text/css'>
/*設定所有標題的樣式*/
th:nth-child(1n) {
	width:60px;
    text-align:center;
    background-color: silver;
}
/*設定第一欄的樣式*/
td:nth-child(1){
	text-align:center;
	background-color: silver;
}
/*設定複數列的樣式*/
tr:nth-child(2n){
		background-color: lightblue;
}
/*設定單數列的樣式*/
tr:nth-child(2n+1){
		background-color: lightgreen;
}
/*設定第六欄的樣式*/
td:nth-child(6n){
		text-align:center;
		background-color: gold;
}
</style>
</head>
<body>
<table>
<thead>
	<tr>
		<th>#</th>
		<th>標題1</th>
		<th>標題2</th>
		<th>標題3</th>
		<th>標題4</th>
		<th>標題5</th>
		<th>標題6</th>
		<th>標題7</th>
	</tr>
</thead>
<tbody>
	<tr>
		<td>1</td>
		<td>data 1</td>
		<td>data 2</td>
		<td>data 3</td>
		<td>data 4</td>
		<td>data 5</td>
		<td>data 6</td>
		<td>data 7</td>
	</tr>
	<tr>
		<td>2</td>
		<td>data 1</td>
		<td>data 2</td>
		<td>data 3</td>
		<td>data 4</td>
		<td>data 5</td>
		<td>data 6</td>
		<td>data 7</td>
	</tr>
	<tr>
		<td>3</td>
		<td>data 1</td>
		<td>data 2</td>
		<td>data 3</td>
		<td>data 4</td>
		<td>data 5</td>
		<td>data 6</td>
		<td>data 7</td>
	</tr>
	<tr>
		<td>4</td>
		<td>data 1</td>
		<td>data 2</td>
		<td>data 3</td>
		<td>data 4</td>
		<td>data 5</td>
		<td>data 6</td>
		<td>data 7</td>
	</tr>
	<tr>
		<td>5</td>
		<td>data 1</td>
		<td>data 2</td>
		<td>data 3</td>
		<td>data 4</td>
		<td>data 5</td>
		<td>data 6</td>
		<td>data 7</td>
	</tr>
	<tr>
		<td>6</td>
		<td>data 1</td>
		<td>data 2</td>
		<td>data 3</td>
		<td>data 4</td>
		<td>data 5</td>
		<td>data 6</td>
		<td>data 7</td>
	</tr>
	<tr>
		<td>7</td>
		<td>data 1</td>
		<td>data 2</td>
		<td>data 3</td>
		<td>data 4</td>
		<td>data 5</td>
		<td>data 6</td>
		<td>data 7</td>
	</tr>
</tbody>
</table>

</body>
</html>
	<html>
	<head>
	<style type='text/css'>
	/設定所有標題的樣式/
	th:nth-child(1n) {
	width:60px;
	text-align:center;
	background-color: silver;
	}
	/設定第一欄的樣式/
	td:nth-child(1){
	text-align:center;
	background-color: silver;
	}
	/設定複數列的樣式/
	tr:nth-child(2n){
	background-color: lightblue;
	}
	/設定單數列的樣式/
	tr:nth-child(2n+1){
	background-color: lightgreen;
	}
	/設定第六欄的樣式/
	td:nth-child(6n){
	text-align:center;
	background-color: gold;
	}
	</style>
	</head>
	<body>
	<table>
	<thead>
	<tr>
	<th>#</th>
	<th>標題1</th>
	<th>標題2</th>
	<th>標題3</th>
	<th>標題4</th>
	<th>標題5</th>
	<th>標題6</th>
	<th>標題7</th>
	</tr>
	</thead>
	<tbody>
	<tr>
	<td>1</td>
	<td>data 1</td>
	<td>data 2</td>
	<td>data 3</td>
	<td>data 4</td>
	<td>data 5</td>
	<td>data 6</td>
	<td>data 7</td>
	</tr>
	<tr>
	<td>2</td>
	<td>data 1</td>
	<td>data 2</td>
	<td>data 3</td>
	<td>data 4</td>
	<td>data 5</td>
	<td>data 6</td>
	<td>data 7</td>
	</tr>
	<tr>
	<td>3</td>
	<td>data 1</td>
	<td>data 2</td>
	<td>data 3</td>
	<td>data 4</td>
	<td>data 5</td>
	<td>data 6</td>
	<td>data 7</td>
	</tr>
	<tr>
	<td>4</td>
	<td>data 1</td>
	<td>data 2</td>
	<td>data 3</td>
	<td>data 4</td>
	<td>data 5</td>
	<td>data 6</td>
	<td>data 7</td>
	</tr>
	<tr>
	<td>5</td>
	<td>data 1</td>
	<td>data 2</td>
	<td>data 3</td>
	<td>data 4</td>
	<td>data 5</td>
	<td>data 6</td>
	<td>data 7</td>
	</tr>
	<tr>
	<td>6</td>
	<td>data 1</td>
	<td>data 2</td>
	<td>data 3</td>
	<td>data 4</td>
	<td>data 5</td>
	<td>data 6</td>
	<td>data 7</td>
	</tr>
	<tr>
	<td>7</td>
	<td>data 1</td>
	<td>data 2</td>
	<td>data 3</td>
	<td>data 4</td>
	<td>data 5</td>
	<td>data 6</td>
	<td>data 7</td>
	</tr>
	</tbody>
	</table>

	</body>
	</html>