el select多选后高度改变
时间: 2023-07-21 22:04:13 浏览: 366
el-select 下拉框多选实现全选的实现
5星 · 资源好评率100%
当 `el-select` 设置为多选模式时,它的高度确实会发生变化。这是因为多选模式下,`el-select` 会展开显示所有选项,并且可以选择多个选项。
如果你希望控制 `el-select` 多选模式下的高度,你可以使用 `popper-class` 属性和自定义样式来实现。
首先,在 `el-select` 上添加 `popper-class` 属性,并设置一个自定义的类名:
```html
<el-select multiple popper-class="custom-popover">
<!-- select options -->
</el-select>
```
然后在你的样式表中定义 `.custom-popover` 类:
```css
.custom-popover {
max-height: 200px; /* 设置最大高度 */
overflow-y: auto; /* 设置垂直滚动 */
}
```
使用上述代码,你可以将 `el-select` 多选模式下的弹出框高度限制在 200 像素,并提供滚动条以便查看超出视图范围的选项。你可以根据需要调整 `max-height` 的值来适应你的布局要求。
阅读全文