CSS3中的nth-of-type伪元素选择前几个或后几个。nth使用时应该注意几点。(n)中的n如果有运算,n必须放在前面,n从0开始递增,()内运算结果大于元素个数,运算自动停止。
选择1~9<li>如下:
li:nth-of-type(-n+9) {background:red}
选择9~最后<li>如下:
li:nth-of-type(n+9) {background:red}
选择倒数2个<li>如下:
li:nth-last-of-type(-n+2) {background:red}
nth-child也是同样用法:
li:nth-child(-n+9) {background:red} //1~9个 li:nth-child(n+9) {background:red} //9~最后 li:nth-last-of-type(-n+2) {background:red} //倒数2个
这类应用在平时WEB开发经常用到。