vue引用了第三方组件,需要在组件中局部修改第三方组件的样式,而又不想去除scoped属性造成组件之间的样式污染。此时只能通过>>>,穿透scoped。
有些Sass 之类的预处理器无法正确解析 >>>。可以使用 /deep/ 操作符( >>> 的别名)
passenger-search-form是我赋予整个表单的class,取什么名字都可以。
1 <style scoped> 2 /* 使得宽度可以自适应 */ 3 .passenger-search-form >>> .el-form-item { 4 width: 100% ; 5 } 6 .passenger-search-form >>> .el-form-item__label { 7 width: 35% ; 8 } 9 .passenger-search-form >>> .el-form-item__content { 10 width: 60% ; 11 } 12 .passenger-search-form >>> .el-select { 13 width: 100% ; 14 } 15 </style>