Vue中scoped穿透 修改子组件样式

vue引用了第三方组件(如使用vue.ant.design的组件时)，需要在组件中局部修改第三方组件的样式，而又不想去除scoped属性造成组件之间的样式污染。

1.stylus的样式穿透 使用 >>>

 .wrapper >>> .ant-tabs-nav-scroll {
      background-color: #ffffff;
      padding-left: 24px;
  }

2.样式穿透 使用/deep/

 .wrapper /deep/ .ant-tabs-nav-scroll {
      background-color: #ffffff;
      padding-left: 24px;
  }

3.使用全局样式表（不推荐）

1. 一般情况下，引入import '../global.css'全局得样式
2. 或者是直接在 app.vue文件中写全局定义，下面是在全局得app.vue中写

<template>
  <div id="app">
    <router-view/>
  </div>
</template>

<script>
export default {
  name: 'App'
}

</script>

<style>
/* 上面没加 scoped 属性，所以全局样式 */ 
.container.xx组件样式类 {
     background-color: #ffffff;
     padding-left: 24px;
 }
</style>