水平展示:
外面包个div,再设置属性:
代码示例:文章来源:https://www.toymoban.com/news/detail-516256.html
.home-header-menu .el-menu--horizontal>.el-menu-item {
height: 50px;
line-height: 50px;
}
.home-header-menu .el-menu--horizontal>.el-submenu .el-submenu__title {
height: 50px;
line-height: 50px;
}
<!-- 水平展示 -->
<div class="homeHeader-menus-bg" style="margin-top:0px;">
<el-menu router class="el-menu-demo" background-color="#0f3365" text-color="#fff" active-text-color="#ffd04b" mode="horizontal" @select="handleSelect">
<el-submenu background-color="#545c64" text-color="#ffffff" active-text-color="#409EFF" :index="index + ''"
v-for="(item, index) in routes" :key="index">
<template slot="title">
<i :class="item.iconcls" style="margin-right:10px;color:#0f3365"></i>
<span>{{ item.name }}</span>
</template>
<el-menu-item :index="children.path" v-for="(children, indexj) in item.children" :key="indexj">
{{ children.name }}
</el-menu-item>
</el-submenu>
</el-menu>
</div>
效果:
文章来源地址https://www.toymoban.com/news/detail-516256.html
到了这里,关于vue vue-element-ui组件 el-menu高度设置的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!