CSS修改组件样式以及修改Element、Vant组件的方法

问题引出

        在使用vue编写前端代码的时候经常会用到ElementUI、Vant等第三方组件，但是有一些组件里面的样式是封装好的，我们需要在局部组件中修改他们的组件库样式，又不能去除scoped属性（造成组件之间的样式覆盖）。+

方法1：适用于sass和less的样式穿透  使用 /deep/

外层类  /deep/ 第三方组件类{

        修改的第三方组件的类

}

//例：
  .order_vload {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.2vw 4.7vw 1.7vw;
    background: rgba(0, 0, 0, 0.7);
    border-radius: 1vw;
    transform: scale(1.17);
    }
   .order_vload /deep/ .van-loading__text {
      margin: 1.7vw 0 0;
      font-size: 3.2vw;
    }
  

方法2：stylus的样式穿透 使用 >>>

.order_vload {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2.2vw 4.7vw 1.7vw;
  background: rgba(0, 0, 0, 0.7);
  border-radius: 1vw;
  transform: scale(1.17);
}
.order_vload >>> .van-loading__text {
  margin: 1.7vw 0 0;
  font-size: 3.2vw;
}