css选择其指定标签父元素的子元素(first-child 与 first-of-type之间的区别)

一、选择元素父级的子元素(包含其它不相同的元素)

(1)li:first-child {  };  选择第一个子元素(注意这里没有括号)

(2)li:last-child {  };  选择ul中最后一个子元素

(3)li:nth-child(3) {  };  顺数第三个元素

(4) li:nth-last-child(3) {  };  倒数第三个

 

二、选择父级元素的相同子元素(不包含不相同的子元素)

(1)li:first-of-type {  }  选择第一个li

(2)li:last-of-type{  }  选择最后一个li

(3)li:nth-of-type(n) {  }     选择第n个li

(4) li:nth-last-of-type(n) {  }  倒数第n个li

n可以是奇、偶数,odd代表奇数,even代表偶数

由于ul里面只能是li,所以以上两种方法用于li下没有太大区别,如果用于p或div等其它标签时则区别很大;

posted @ 2017-12-29 17:52  hobi24  阅读(7029)  评论(0)    收藏  举报