如何让字体进入导航里面用的element ui

原效果

img


我的效果

img


代码

    <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect" >
  <el-menu-item index="1" class="fontClass">艺术梦想基金</el-menu-item>
  <el-menu-item index="1" class="fontClass">NFT销毁</el-menu-item>
  <el-menu-item index="1" class="fontClass">NFT</el-menu-item>
  <el-menu-item index="1" class="fontClass">平台清理</el-menu-item>
  <el-menu-item index="1" class="fontClass">白皮书</el-menu-item>
  <el-menu-item index="1" class="fontClass">处理中心</el-menu-item>
  <el-menu-item index="1" class="fontClass">处理中心</el-menu-item>
</el-menu>


.fontClass{
  margin-right: 10px !important;
  height: 20px !important;
}

代码贴的少了点,右键查看一下源代码,line-height是不是太高了

我记得 element-ui的菜单 是有默认高度的 好像是60px 所以 你需要修改element-ui的一些元素的css属性 如 height line-height。你已经设置了height 设置line-height:20px !important

先把fontClass里面的height属性删除看看是不是正常的 ,如果是的话就是因为你只改了height没有该默认的line-height,修改element ui样式建议使用[>>>]