vue+element穿梭框样式修改。

Question

今天做穿梭框，但因为初始的宽度与高度不适应。但我修改的不是el-transfer的宽度，而是他自带的属性el-transfer-panel的样式。就是内容框的样式

向style里面去放el-transfer-panel这个属性进行控制宽度与高度时可以实现，但是全局配置都会改变，别的页面使用穿梭框时也会改变他的样式，如果style里面加上 scoped，又不会顶掉element自带的css样式，宽度高度无法改变。在属性值后面加！important也试过依旧不好使

在网上查阅都是让找index.css去修改样式，但是这个样式我并不想去更改全局样式，只让他在本页面生效，别的页面不生效
现在已经无计可施，有没有大佬可以给个建议啊

Answer 1

VUE引入LESS

<style lang="less">
.父DivClassName{
    .el-transfer-panel{
    }
}
</style>

Answer 2

加个自定义class，css用两个类名控制

Answer 3

加上deep 穿透试试：

<style lang="less" scoped>
/deep/ .el-transfer-panel{
    width: 250px;
    height: 400px;
}
</style>

Answer 4

问题有解决么？可以告知一下解决方式么？