css3常用属性之选择器

之前记录过一篇关于css3属性在表现方面的例子，今天在来讲讲css3选择器的使用方法。

第一个子节点;first-child

   /*first-child 所在元素为父元素的第一个子节点*/
    ul li:first-child{
    	border:1px solid red;
    }

 

最后一个子节点：last-child

/*first-child 所在元素为父元素的第一个子节点*/ 
ul li:nth-of-type(3){ border:1px solid blue; } 

 指定相应的子节点：nth-of-type(number)

/*nth-of-type(number) 指定相应的节点*/ 
ul li:nth-of-type{ border:1px solid green; } 

 奇偶节点选择：nth-of-type(even/odd)

/*nth-of-type(even) 指定节点为偶数的子节点*/ 
ul li:nth-of-type(even){  } 

/*nth-of-type(odd) 指定节点为奇数的子节点*/ 
ul li:nth-of-type(odd){ border-radius:10px;  } 

 

 :not(first-child):筛选除此之外的元素

/*：not(:first-child) 选择不是第一个子节点的元素*/ 
ul li:not(:first-child){ border:1px solid red;} 

demo:http://2.liteng.sinaapp.com/css3select.html

更多详情参考：http://www.w3school.com.cn/cssref/css_selectors.asp