elementPlus的select弹出框的层叠样式

写项目的时候遇到一个问题,就是input和select什么的都能选择,但是弹出框却没显示在最外面,就是被其他容器挡住了,无法操作

找了网上很多方式去修改都没用,就自己找官方文档翻了会,也不是看得很懂,这张图是select文档,可以看到引入样式有popper

关于el-select-dropdown_item的相关设置可以看一下这篇博客,elementUi重置Select选择器样式、option、deep、vue3、plus,我后面也在文档里找到了有关dropdown的相关内容,跟上面那篇博客里修改样式用的类对上,所以我判断我应该没找错,就是这个dropdown看到后面也没找到z-index之类的设置,可能是我没找到,反正我就推测还可能是popper的问题,就去看了下popper的文档

popper文件里一眼就能看到z-index设置为2000,不知道怎么修改这个popper里的z-index,我就把我程序的几个div的z-index全部设置的比2000小

原来大概的样式是这样

修改为这样,总之比2000小就行(我尝试了下,2000出头左右的数字也可以展示,也不懂哪里改了,3000不行,中间的区段没试)

修改后的展示效果是这样

也算是解决了这个问题,如果有哪位懂的,方便的话可以和我说说🙏,以前都没耐心看文档,这一次算是沉下心来看一会,也不知道自己说的对不对,有错误欢迎指出。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值