[分享]css3序列选择器

CSS3序列选择器是CSS3中一种非常有用的选择器，它可以让我们通过指定元素在某个序列中的位置来选择元素。序列选择器有三种：nthchild、nthlastchild以及nthoftype。/ 选择第...

CSS3序列选择器是CSS3中一种非常有用的选择器，它可以让我们通过指定元素在某个序列中的位置来选择元素。序列选择器有三种：nth-child、nth-last-child以及nth-of-type。

/* 选择第n个子元素 */
/* 例如选择第二个p元素 */
p:nth-child(2) {
  color: red;
}

/* 选择倒数第n个子元素 */
/* 例如选择倒数第二个p元素 */
p:nth-last-child(2) {
  color: blue;
}

/* 选择同种类型的第n个元素 */
/* 例如选择第三个p元素 */
p:nth-of-type(3) {
  color: green;
} 

其中，nth-child可以选择任意子元素，而nth-of-type只能选择同种类型的子元素。nth-last-child则是从后往前选择子元素。

需要注意的是，序列选择器中的序号是从1开始的，而不是从0开始。还有，序列选择器在一些老版本的浏览器中可能不被支持，需要注意兼容性问题。