CSS nth-child() 給連續的幾個DIV元素賦不同的背景色

<div id="OutSide">
			<div class="InSide"></div>
			<div class="InSide"></div>
			<div class="InSide"></div>
			<div class="InSide"></div>
			<div class="InSide"></div>
			<div class="InSide"></div>
			<div class="InSide"></div>
			<div class="InSide"></div>
			<div class="InSide"></div>
		</div>

如上 想給ID==OutSide的div下的九個div分別賦上不同的顏色以行程九宮格。

這時用到了nth-child()

在樣式里這樣寫

#OutSide div:nth-child(1){ background-color: red;}
#OutSide div :nth-child(2){ background-color: blue;}
#OutSide div :nth-child(3){ background-color: green;}
#OutSide div :nth-child(4){ background-color: purple;}
#OutSide div :nth-child(5){ background-color: palegreen;}
#OutSide div :nth-child(6){ background-color: palevioletred;}
#OutSide div :nth-child(7){ background-color: pink;}
#OutSide div :nth-child(8){ background-color: plum;}
#OutSide div :nth-child(9){ background-color: mistyrose;}

可以理解為 ID==OutSide的父級元素下，第一個div子級，第二個，第三個div子級,依次類推