📜  CSS | :nth-of-type() 选择器

📅  最后修改于: 2021-08-31 07:50:11             🧑  作者: Mango

css Selector 中的:nth-of-type()仅用于样式化那些是其父元素的第 n 个子元素的元素。 n 可以是数字、关键字或公式。

句法:

:nth-of-type(number) {
  // CSS Property;
} 

其中number是表示匹配元素模式的参数。它可以是奇数、偶数或函数符号。

  • 奇数:表示序列中位置为奇数的元素:1、3、5 等,从末尾开始计数。
  • even:表示一系列中位置为偶数的元素:2、4、6等,从末尾开始数。
  • 函数符号 ():它表示兄弟位置与模式 An+B 匹配的元素,对于 n 的每个正整数或零值。从末尾开始计数的第一个元素的索引为 1。

示例 1:



  

    

  

    
        

GeeksForGeeks

        

:nth-of-type() Selector

        

geeksforgeeks

            

A computer science portal for geeks.

                

Sudo placement.

                

GFG STANDS FOR GEEKSFORGEEKS.

     

输出 :

    示例 2:在此示例中,通过使用odd 或even 关键字作为参数来选择每个奇数和偶数元素。

    
    
      
    
        
    
      
    
        
            

    GeeksForGeeks

            

    :nth-of-type() Selector

            

    geeksforgeeks

                

    A computer science portal for geeks.

                

Sudo placement.

                

GFG STANDS FOR GEEKSFORGEEKS.

     

输出:

支持的浏览器: :nth-of-type() Selector 支持的浏览器如下: