CSS3中first-child、last-child、nth-child、nth-last-child

1.單獨指定第一個子元素、最後一個子元素的樣式

<style type="text/css">

li:first-child{

  background:yellow;

}

li:last-child{

   background:blue;

}

</style>

 

2.對指定序號的子元素使用樣式

<style type="text/css">

li:nty-child(2){

  background:yellow;

}//對第二個子元素設定背景色

li:nth-last-child(2){

  background:blue;

}//對倒數第二個子元素設定背景色

</style>

 

3.對全部第偶數個子元素或者第奇數個子元素使用樣式

<style type="text/css">

li:nth-child(odd){

  background:yellow;

}

li:nth-child(even){

 background:blue

}

</style>