最近在使用uniapp，做一款跨平台的APP，用到了UI框架和一些uniapp的组件，很多时候组件的样式不能满足需求，但是修改的时候又无法修改；

原因就是scoped的问题，组件中习惯使用一个带有scoped属性的Style标签，当然也是为了防止组件之间的样式冲突问题，scoped属性效果，就是在编译打包后在当前组件标签中统一添加一个随机属性（v-data-356hjxxxxxxx），下图所示：

这个问题该怎么解决呢？

可以使用css里面的样式穿透，官网vue-loader中我们所谓的样式穿透，官方叫做深度作用选择器

用法1：stylus样式穿透，使用  >>>

<style scoped>
.a >>> .b { /* ... */ }
</style>

编译后：

.a[data-v-f3f3eg9] .b { /* ... */ }

用法2：Sass和Less的样式穿透

有些像 Sass 之类的预处理器无法正确解析 >>>。这种情况下你可以使用 /deep/ 或 ::v-deep 操作符取而代之——两者都是 >>> 的别名，同样可以正常工作。

父组件 : : v-deep 子组件

父组件 / deep / 子组件

.evan-border ::v-deep .evan-form-item-container {
  border: none;
}
.tell-language /deep/ .dropWrap {
  width: 195rpx;
}