[分享]css3排除nth

CSS3中的伪类选择器中有一个非常实用的nthoftype()，它可以选择某一类型的元素中第n个元素。不过，有时候我们需要选取除了某些元素之外的其他元素。这时候可以使用:nthoftype()的变体：...

CSS3中的伪类选择器中有一个非常实用的nth-of-type()，它可以选择某一类型的元素中第n个元素。不过，有时候我们需要选取除了某些元素之外的其他元素。这时候可以使用:nth-of-type()的变体：

:nth-of-type(an+b) 以from为起点，选取每一个位置为(an+b)的元素。
:nth-of-type(-an+b) 选取至第b个元素的所有位置。 

然而，如果我们想要排除某些元素的时候，就需要涉及到nth-of-type()的排除（:not()）变体。下面是两种不同的方式：

/* 第一种方式：使用:nth-of-type()排除 */
/* 选取除第一个p和第一个div之外的所有元素 */
p:not(:first-of-type), div:not(:first-of-type) {
  /* styles */
}

/* 第二种方式：使用:nth-of-type()结合:nth-last-of-type() */
/* 选取除了第一个以外的所有除p之外的div元素 */
div:not(:first-of-type):nth-last-of-type(n+2) {
  /* styles */
} 

注意，排除（:not()）不能直接使用nth-of-type()，需要在其中添加其他的选择器才可以。以上两种方式在实现的效果上都是一样的。如果你需要使用某些元素之外的其他元素，可以使用这些方法来实现。