element 菜单替换选中下划线样式和隐藏下划线

<el-menu :default-active="activeIndex" class="el-menu-demo" text-color='#222222' close="" active-text-color='#1f84e0' mode="horizontal"
       @select="handleSelect">
        <el-menu-item class="el-menu-item" icon='el-icon-caret-top' index="1">首页<i v-if="activeIndex=='1'" class="el-icon-caret-top"></i></el-menu-item>
        <el-menu-item index="2" >热门咨询 <i class="el-icon-caret-top" v-if="activeIndex=='2'"></i></el-menu-item>
    </el-menu>

上面是用图标显示

css隐藏,就是修改编辑颜色

.el-menu-demo .el-menu-item{
    border-bottom-color:#ffffff!important;
    font-size: 16px;

}

图标位于菜单文字中间

.el-icon-caret-top{
    position: absolute;
    bottom: -8px;
    left: 34%;
    color: #1F51A9!important;
}

显示修改