如何使用 CSS 获取特定数量的子元素？

CSS Selector 中的:nth-child()用于仅选择作为其父级的第 n 个子级的元素，无论其类型如何。

句法：

: nth-child(arg) {
    // CSS Property;
} 

其中arg是一个参数，表示匹配元素的模式。它可以是数字、奇数、偶数或线性方程。

• number：表示位置由参数指定的元素。
• 奇数：表示位置为奇数的元素，即1、3、5等。
• even：表示位置为偶数的元素，即2、4、6等。
• 线性方程：它表示位置与模式 A*n + B 匹配的元素，对于每个正整数 n。 n 的值从零开始。

示例 1：此示例选择作为参数传递的元素。

  

    

  

    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks

  
                    

输出：

示例 2：此示例选择偶数子元素。

  

    

  

    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks

  
                    

输出 ：

示例 3：此示例选择奇数子元素。

  

    

  

    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks

  
                    

输出 ：

示例 4：本示例以线性方程为参数。

  

    

  

    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks
    
GeeksforGeeks

  
                    

输出：