Element UI NavMenu 鼠标悬停背景颜色修改教程

可以在 element-ui 的样式文件中找到 NavMenu 的样式，一般是在 theme 文件夹下的对应主题的 nav-menu.scss 文件中，可以找到类似以下代码：

.el-menu {
  background-color: #f7f7f7;
  border-right: 1px solid #ebebeb;
  border-left: 1px solid #ebebeb;
  border-bottom: 1px solid #ebebeb;
  display: inline-block;
  vertical-align: top;
  width: 200px;
  .el-menu-item, 
  .el-submenu__title {
    background-color: #fff;
  }
  .el-menu-item.is-active, 
  .el-menu-item:hover, 
  .el-submenu.is-active > .el-submenu__title, 
  .el-submenu__title:hover {
    background-color: #f5f5f5;
    color: #409eff;
    cursor: pointer;
  }
  // 其他样式代码
}

可以看到，NavMenu 的背景颜色是由 '.el-menu-item.is-active' 和 '.el-menu-item:hover' 类的 'background-color' 属性决定的，可以在这里调整颜色值即可。注意修改完样式文件后需要重新编译生成新的样式文件。