VUE修改样式无效

 

 

 

 

 

 vue引用了第三方组件，需要在组件中局部修改第三方组件的样式，而又不想去除scoped属性造成组件之间的样式污染。此时只能通过>>>，穿透scoped。
有些Sass 之类的预处理器无法正确解析 >>>。可以使用 /deep/ 操作符( >>> 的别名)

passenger-search-form是我赋予整个表单的class，取什么名字都可以。

<style scoped>
/* 使得宽度可以自适应 */
.passenger-search-form >>> .el-form-item {
  width: 100% ;
}
.passenger-search-form >>> .el-form-item__label {
  width: 35% ;
}
.passenger-search-form >>> .el-form-item__content {
  width: 60% ;
}
.passenger-search-form >>> .el-select {
  width: 100% ;
}
</style>