ElementUI 选择器(下拉菜单)样式
:popper-append-to-body="false" 必须写才能覆盖样式
HTML
<el-select v-model="value" placeholder="请选择" :popper-append-to-body="false"> <el-option label="label1" value="value1"> el-option> <el-option label="label2" value="value2"> el-option> el-select>
SCSS
1 /deep/.el-popper { 2 border: 1px solid rgba(32, 139, 248, 0.54); 3 border-radius: 3px; 4 box-shadow: 0px 0px 10px 0px rgba(32, 139, 248, 0.29) inset, 5 0px 0px 12px 1px rgba(32, 139, 248, 0.19) inset; 6 background: #0a274995; 7 } 8 /deep/.el-select { 9 .el-select:hover .el-input__inner, 10 .el-select .el-input__inner:focus, 11 .el-select .el-input.is-disabled .el-input__inner:hover { 12 border: 1px solid rgba(32, 139, 248, 0.54); 13 } 14 .el-select-dropdown__item.selected { 15 color: #8fd4ff !important; 16 } 17 .el-select-dropdown__item { 18 color: #fff; 19 } 20 .el-select-dropdown__item.hover, 21 .el-select-dropdown__item:hover { 22 background-color: #208bf830; 23 } 24 }