el-select显示不全

最新推荐文章于 2024-08-29 11:24:11 发布
原创 最新推荐文章于 2024-08-29 11:24:11 发布 · 835 阅读 · 7 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#javascript #开发语言 #ecmascript #前端 #js

本文介绍了如何通过修改CSS代码，特别是针对`.el-select-dropdown__wrap.el-scrollbar__wrap`选择器，将`.el-select`下拉框的底部外边距设置为不显示(`!important`)，以提升用户体验。

在这里插入图片描述
css代码：

.el-select-dropdown__wrap.el-scrollbar__wrap {
    margin-bottom: 0 !important;
}

在这里插入图片描述

Frilled Lizard
关注
vue2.0 element-ui中el-select选择器无法显示选中的内容(解决方法)
10-18
主要介绍了vue2.0 element-ui中的el-select选择器无法显示选中的内容,在文中小编使用的是element-ui V2.2.3。具体解决方法及示例代码大家参考下本
前端开发el-select下拉框样式修改方案：解决背景色、hover及字体样式定制问题了文档的核心内容
最新发布
04-05
文章首先介绍了网上常见的三种修改样式的方法及其存在的问题，接着深入分析了问题产生的原因，即el-select选项的容器不在挂载的div#app中，导致设置的样式无法正常作用。然后提出了解决方案——通过设置Popper-...
有关el-select选择器内容展示不完整的解决方案
J_mine的博客
04-09 6097
最近接手个工程， 发现了el-select展示不完整；效果如下如图 应该是代码里有之前设置的默认样式导致； 不过由于时间太紧急，没来得及细细查找问题 而是采用了个简单粗暴的办法。 1. 给el-select 标签上插入 :popper-append-to-body="false" 2. css样式 里写 ::v-deep .el-select-dropdown__wrap.el-scrollbar__wrap { margin-bottom: 0 !important; .
解决el-select显示的内容不全
weixin_45880538的博客
01-22 4384
解决el-select显示的内容不全 1.加:popper-append-to-body=“false” <el-select v-model="formValidate.type" placeholder="请选择父级类型" :popper-append-to-body="false" > 样式中加以下内容 /deep/.el-select-dropdown__wrap.el-scrollbar__wrap {
解决el-select下拉框最底部显示不全的问题
zfkdiyi的博客
01-24 1531
看一下你的el-select有没有设置了 :popper-append-to-body=“false” 这个属性，如果有就把它删掉。删掉以后，底部就能显示完全了。
【vue+element ui】大屏自适应中el-select下拉内容在低分辨率下显示不全问题解决
浪潮行舟_2136
02-28 1525
通过谷歌浏览器设置Toggle device toolbar为1028px*720px分辨率，下拉显示异常。使用F12对比查看，发现el-select中的el-select-dropdown__item是固定的；最近要把一个1920px*1080px的大屏改成自适应的；最低适配到1028px*720px；解决办法：将el-select-dropdown__wrap改大，让内容全部显示出来；将电脑屏幕改成1028px*720px分辨率后，下拉显示正常。全局设置，代码如下（项目中使用到的是scss）
精选资源
el-tree-select:基于el-select和el-tree改造的树形选择器（下拉框）组件
05-10
1. **树结构显示**：el-tree-select将数据以树状结构展现，能够清晰地展示具有层次关系的数据，如部门结构、地区层级等。用户可以逐级展开节点，查看和选择相应的选项。 2. **选择模式**：作为el-select的扩展，它...
解决element-ui里的下拉多选框 el-select 时,默认值不可删除问题
10-14
在使用element-ui开发Web项目时，经常会遇到一些组件使用上的细节问题，其中element-ui中的下拉多选框组件el-select使用时，如何设置默认值且不可删除，是一个较为常见的需求。本文将详细介绍如何解决这个问题，以及...
el-select 内容显示不完整解决方法
weixin_42349215的博客
08-24 2831
:popper-append-to-body="false" /deep/ .el-select-dropdown__wrap.el-scrollbar__wrap{ margin-bottom: 0 !important; } 组件el-select会默认添加到body里面，因此只修改样式不能直接起作用，需要添加第一行！！！
vue-admin下拉框el-select最后一个显示不全，会出现margin-bottom: -17px；
qq_630354780的博客
08-29 368
问题所在是因为出现：margin-bottom: -17px;
el-select 下拉框内容被遮挡
qq_28586135的博客
04-24 2706
el-select 下拉框内容被遮挡
el-select下拉菜单最后一个显示不全的问题
JunJiu0420的博客
09-06 729
注意：需要在不含scoped的全局样式中添加。
Web前端之Vue+ElementUi+selsct+option实现下拉菜单最后一项显示不全、问题、deep、less、sass、scss
优快云博客主页地址：https://mengjian.blog.youkuaiyun.com/
06-08 2453
Web前端之Vue+ElementUi+selsct+option实现下拉菜单最后一项显示不全、问题、deep、less、sass、scss
vue + element + select 下拉菜单跟模态框显示下拉菜单数据位置不正确
weixin_45477548的博客
11-18 1005
最近遇到个问题，下拉菜单放在模态框里面，如果页面展示数据不多的话下拉菜单里面的数据位置是正确的，但是数据多了就错位了。就变成了 正常是这样的 这是element的坑，看了网上别人的解决办法，我都没有发现好的。网上普遍使用popper-append-to-body=“false”这个属性，不然就是在加style 再写上!important，没有完美的解决，不过可以换一个思路来想，因为页面高度发生变化，才会导致这个问题发生，那如果我回到顶部不就可以避免了。所以就加了一句回到顶部的代码，自我感觉完美解决了。如
element-plus下拉选择select只显示最后一个解决办法
bird__yuan的博客
10-09 983
在用到element-plus下拉选择select时候会遇到无论怎么选择都选中的是最后一个
vue中的treeselect下拉框显示不全的解决办法
java_zhangfei的博客
04-08 2065
【代码】vue中的treeselect下拉框显示不全的解决办法。
vue解决Element-ui中 el-cascader 级联选择器 最后一级数据为空显示暂无数据问题
票票的博客
10-14 2620
1. 出现问题bug: el-cascader控件 最后一级出现空白 暂无数据 2. 解决办法: 使用递归的方式，将最底层中的 children 设为 undefined 2.1 html代码 <el-cascader v-model="busAreaForm.codeUp" placeholder="请选择" :options="codeUpList" :props="{ checkStrictly: true }" show-all-levels ></el-ca
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值