day2-1，css结构伪类选择器-基本使用

1. <style>
   
2.     /* 第一个 */
   
3.     /* li:first-child {
   
4.       background-color: green;
   
5.     } */
   
6. 
   
7.     /* 最后一个 */
   
8.     /* li:last-child {
   
9.       background-color: green;
   
10.     } */
    
11. 
    
12.     /* 任意个 */
    
13.     /* li:nth-child(3) {
    
14.       background-color: green;
    
15.     } */
    
16. 
    
17.     li:nth-child(1) {
    
18.       background-color: green;
    
19.     }
    
20.   </style>

复制代码

<style>
    /* 偶数 */
    /* li:nth-child(2n) {
      background-color: green;
    } */

    /* 奇数 */
    /* li:nth-child(2n+1) {
      background-color: green;
    } */

    /* 倍数 */
    /* li:nth-child(5n) {
      background-color: green;
    } */

    /* n 从0开始 */
    /* 第5个以后的标签 */
    /* li:nth-child(n+5) {
      background-color: green;
    } */

    /* 第5个以前的标签 */
    li:nth-child(-n+5) {
      background-color: green;
    }
  </style>