el-dropdown-menu 二次展开出现滚动条
时间: 2023-10-07 20:06:25 浏览: 109
含有滚动下拉菜单的导航条
4星 · 用户满意度95%
要实现el-dropdown-menu二次展开后出现滚动条,需要设置它的高度并将overflow属性设置为auto。具体来说,可以使用以下CSS样式来设置el-dropdown-menu的样式:
```css
.project-dropdown {
height: 300px;
overflow: auto;
}
```
其中,height属性用来设置元素的高度,这样才能显示出滚动条。而overflow属性设置为auto表示当内容超出元素的高度时,自动显示滚动条。
另外,根据提供的HTML代码,el-dropdown-menu是作为el-dropdown组件的slot部分存在的,所以可以将以上样式应用到el-dropdown-menu的class中:
```html
<el-dropdown-menu class="project-dropdown" slot="dropdown">
<!-- 下拉菜单的内容 -->
</el-dropdown-menu>
```
这样,在el-dropdown-menu二次展开后,如果内容超出了300px的高度,就会出现滚动条。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* [Element-UI 给el-dropdown添加滚动条](https://blog.csdn.net/ddk54321/article/details/89083335)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *3* [vue+element搭建后台小总结 el-dropdown下拉功能](https://download.csdn.net/download/weixin_38724154/13676609)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]
阅读全文