下拉框代码
<el-selectclass="buttons-switch-group select-hub":teleported="false"style="width: 120px"v-model="queryParam.type"placeholder="请选择"size="mini"@change="loadData"><el-option label="客运站" value="客运站"></el-option><el-option label="高铁站" value="高铁站"></el-option><el-option label="码头" value="码头"></el-option><el-option label="火车站" value="火车站"></el-option><el-option label="机场" value="机场"></el-option></el-select>
样式穿透
.buttons-switch-group {--el-fill-color-blank: rgba(8, 20, 65, 0.3);--el-border: 1px solid #073f97;--el-text-color-regular: #dedfe4;
}
.select-hub:deep(.el-select__wrapper) {min-height: 0.875rem !important;min-width: 2rem !important;box-shadow: 0 0 0 1px #008cffff inset;border-image: linear-gradient(180deg, rgba(28, 173, 255, 1), rgba(0, 140, 255, 1)) 1 1;
}
.select-hub:deep(.el-popper.is-light .el-popper__arrow::before) {border: 1px solid #01194d !important;background: #01194d !important;
}.select-hub:deep(.el-popper.is-light) {background: #01194d;//border: 1px solid #273f70;
}
.select-hub:deep(.el-select-dropdown__item) {text-align: left;background: #01194d;border: none;color: #fff;
}