CSS :nth-last-of-type() 伪类

定义和用法

CSS :nth-last-of-type(n) 伪类用于匹配作为其父元素中特定类型的倒数第 n 个子元素的每个元素。

n 可以是一个数字/索引、一个关键字（odd 或 even）或一个公式（如 an + b）。

提示：查看 :nth-last-child() 伪类以选择作为其父元素中倒数第 n 个子元素的元素，无论其类型如何。

实例

例子 1

为每个作为其父元素倒数第二个

元素的

元素指定背景颜色。

同时，为每个作为其父元素倒数第三个

  • 元素的
  • 元素指定背景颜色：

    p:nth-last-of-type(2) {
  background: red;
}
li:nth-last-of-type(3) {
background: yellow;
}

    ਆਪਣੇ ਆਪ ਕੋਸ਼ਿਸ਼ ਕਰੋ

    例子 2

    odd 和 even 是关键字，可用于匹配索引为奇数或偶数的子元素（第一个子元素的索引为 1）。

    在这里，我们为奇数索引和偶数索引的

    元素指定不同的背景颜色：

    p:nth-last-of-type(odd) {
  background: red;
}
p:nth-last-of-type(even) {
  background: blue;
}

    ਆਪਣੇ ਆਪ ਕੋਸ਼ਿਸ਼ ਕਰੋ

    ਉਦਾਹਰਣ 3

    ਫਾਰਮੂਲਾ (an + b) ਦੀ ਵਰਤੋਂ ਕਰਕੇ ਵਰਣਨ: a ਇੰਟੀਜਰ ਸਟੇਪ, n ਹੈ 0 ਤੋਂ ਸ਼ੁਰੂ ਹੋਣ ਵਾਲਾ ਸਾਰੇ ਸਿਫਾਰਸ਼ ਦਾ ਗੁਣਾ, b ਇੰਟੀਜਰ ਓਫਸੈਟ ਹੈ。

    ਇੱਥੇ, ਅਸੀਂ 3 ਦੇ ਗੁਣਾ ਦੇ ਅੰਤਿਮ ਸਿਫਾਰਸ਼ ਸਿਫਾਰਸ਼ ਦੇ ਸਾਰੇ <p> ਅਤੇ <li> ਐਲੀਮੈਂਟਾਂ ਲਈ ਪਿੱਟਰਨ ਨਿਰਧਾਰਤ ਕਰਦੇ ਹਾਂ:

    p:nth-last-of-type(3n) {
  background: red;
}
li:nth-last-of-type(3n) {
  background: yellow;
}

    ਆਪਣੇ ਆਪ ਕੋਸ਼ਿਸ਼ ਕਰੋ

    • ਸੀਐੱਸਐੱਸ ਗਰੈਮੈਟਿਕਸ

    :nth-last-of-type(ਇੰਡੈਕਸ ਪਾਸੇ odd | even | ਏਨ+ਬ) {
  ਸੀਐੱਸਐੱਸ ਐਲਾਨ;
}

    ਤਕਨੀਕੀ ਵੇਰਵਾ

    ਵਰਜਨ: ਸੀਐੱਸਐੱਸ3

    ਬਰਾਉਜ਼ਰ ਸਮਰੱਥਾ

    ਸਟੇਬਲ ਵਰਜਨ ਦੇ ਪਹਿਲੇ ਬਰਾਉਜ਼ਰ ਵਿੱਚ ਪ੍ਰਤੀਕ ਦੀ ਪੂਰੀ ਸਮਰੱਥਾ ਦੇ ਸੰਖਿਆ ਨੂੰ ਸਟੇਬਲ ਵਰਜਨ ਵਿੱਚ ਸੰਖਿਆ ਨਾਲ ਦਿੱਤਾ ਗਿਆ ਹੈ。

    ਕਰੋਮ ਐਂਜਲ ਫਾਇਰਫਾਕਸ ਸਫਾਰੀ ਓਪਰਾ
    4.0 9.0 3.5 3.2 9.6