解决/deep/ .el-select-dropdown{ }样式不生效问题
原先代码如下:
/*修改下拉框背景色以及边框线样式*/ /deep/ .el-select-dropdown{ background:#07427a !important; border: 1px solid #0098eb !important; }
发现在网页中样式没有效果,即使加了/deep/和! important也无济于事。
解决方法
在<el-select></el-select>中添加popper-append-to-body属性,将其设置为false(不把弹出框插入至 body 元素)
<el-select :popper-append-to-body="false"> <el-option></el-option> </el-select>
样式生效(需要注意该下拉框父级元素的z-index值必须大于其父级元素同级元素的z-index值,否则会被其余页面元素覆盖,导致无法选择)
最终效果如下: