DIV CSS 佈局教程網

CSS中存在著很多的偽類，在使用上各個浏覽器差別很大，尤其是IE9以下，對偽類的支持非常有限。今天學習兩個個偽類:first-child，:last-child。

1、:first-child :first-child表示選擇器元素集合中的第一個元素，如以下代碼可以使用ul li:first-child{ color:red; }來選擇第一個li元素。

<ul>
<li>first item</li>
<li>second item</li>
<li>third item</li>
<li>last item</li>
</ul>

支持的浏覽器：IE7+，chrome，Firefox，Safari，Opera   2、:last-child :last-child表示選擇器元素集合中的最後一個元素，如上面的例子，可以使用ul li:last-child{ color:red; }來選擇最後一個li元素。   支持的浏覽器：IE9+，chrome，Firefox，Safari，Opera   通過在網上查找，有使用IE hack解決兼容性的方法，不過試了並不可靠。

ul li{
	/* first-child */  
	background-color:expression(this.previousSibling==null?'#f00':'');   
	/* last-child */  
	background-color:expression(this.nextSibling==null?'#f00':'');
}

使用上面的hack方法 first-child效果在IE6中沒有顯示出來

last-child效果在IE6、IE7中顯示正常，在IE8中還是沒有效果