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開發經常用到。