请问大佬们工作中css选择器写多少层合适呀？

比如css样式选择器出现类似这种情况：

.mainbox .center .student-data .data ul li:first-child::after{

/* 设置样式 */

}

就比如li元素前面应该写这么多层.mainbox .center .student-data .data ul吗，从最顶层的标签开始写起有必要吗，或者说这样合适吗？

一般写两三层就行了，只要你的css命名遵循一定的规范。其次你可以考虑使用sass less书写css，可以使用嵌套等众多方便的语法，嵌套写好可以很好的避免这种嵌套很多层的css。

例如

// css
.main {
  color: red;
}

.main .main-wraper {
  color: red;
}

.main .main-content {
  color: red;
}

.main .main-content .main-content-item {
  color: red;
}

.main .main-content .main-content-item:hover {
  color: red;
}

.main .main-content .main-content-item:active {
  color: red;
}


// less可以修改为
.main {
  color: red;

  &-wraper {
    color: red;
  }

  &-content {
    color: red;

    &-item {
      color: red;

      &:hover {
       color: red;
      }

      &:active {
        color: red;
      }
    }
  }
}

如果说.minbox之后的class有重名就必须要这样写，你可以使用scss，scss的&能够代表父级class，在嵌套中.mainbox .center .student-data .data ul可以直接写为&ul。

用less或者sass写样式就不用管这么多了