iview 樣式覆蓋不成功的解決辦法

在vue項目中，使用iview table ，想修改樣式，從chrome瀏覽器中直接定位到要修改的樣式，複製粘貼到自己vue的style scoped

但是並沒有效果。因爲scoped局部作用，避免全局污染，有一定的侷限性

方法1：直接修改iview 原文本.css 或者在組件中<style ></style>直接全局修改（下下策）

方法2：自己在iview table中自定義一個class,在結合後代class選擇器在進行定義樣式

方法3：深度作用選擇器（ >>> ）

<style scoped>
.box >>> .content {
  font-size:20px;
}
</style>

方法4：/deep/ 預處理器less下使用

<style scoped lang="less">
.select {
     /deep/ .ivu-card-body {
        width: 100%;
      }
    }
</style>

而最近谷歌瀏覽器對於/deep/貌似不太友好，控制檯提示/deep/將要被移除。

// 採用的less的轉義和變量插值
<style scoped lang="less">
@deep: ~'>>>';
.select {
     @{deep} .ivu-card-body {
        width: 100%;
      }
    }
</style>