结构伪列选择器

带：冒号的就是伪类

• 结构伪列就是要带定位的--首个，末个，选择 --
• 1.带不带子元素----要不要核对类型 2.子元素是否被空格取代--- 空格可以理解为全部（通配）3.没空格的
  • 1.first-child
    • 父元素 子元素:first-child{ //表示满足父元素类型下的第一个子元素(总排序)}
      • 符合子元素的类型就显示，没有就不显示
    • 父元素 空格 :first-child{ //表示满足父元素类型的下的第一个子元素(总排序的第一个)}
  • 2.last-child
    • 父元素 子元素:last-child{ //表示满足父元素类型下的最后一个子元素(总排序)}
      • 符合子元素的类型就显示，如果没有，，则不显示---
    • 父元素 空格 :last-child{ //表示满足父元素类型下的最后一个子元素(总排序的最后一个)}）
  • 3.nth-child(n) ---n指的是总共的第n个
    • ①父元素 子元素:nth-child(n){//表示父元素下的第n个元素(不分类型的排序)。}
      • 核实第n个是不是子元素类型，不是就不显示 一个个挨着排号
      • 比如div p:nth-child(2)表示div下的第二个p元素、如果不是p元素则没有匹配的元素(就没表现)
    • ②父元素 空格 :nth-child(n){//表示父元素下的第n个元素(不分类型的排序,就是第n个)。}
      • 只要第n个元素存在就会表现
    • ③XX元素:nth-child(n){//表示每一层（包括body）的第n个XX元素}
      • 每一层总排序后的第n个如果是XX元素，则显示
  • 4.nth-of-type(n)---n指的是类型的第n个---所以可能很多个
    • nth-of-type(n) ---肯定分类型的指定
    • ①父元素 子元素:nth-of-type(n) {//表示父元素下的子类型的第ｎ个元素，没的话不显示(分类型的指定)}
      • 比如div p:nth-of-type(2)表示div下ｐ类型的第二个元素 --依据类型进行排号选择
    • ②父元素 空格 :nth-of-type(n) --表示父元素下的每个类型的第n个元素，
      • div :nth-of-type(n) 分类型
      • 每个类型的第n个都被选中
    • ③XX元素:nth-of-type(n) --表示XX元素下XX类型的第n个元素---分类型
  • 5.child和type 的最大区别
    • 总的来说 child 是总排序，第n个存在（指定的就得复核）就显示 type是类型排序，类排序的第n个存在就显示

--------------------------------------------------------更多java学习 https://zhangjzm.gitee.io/self_study

结构伪列选择器超详解！！！！