vue-admin-template 导航栏修改hover

要修改 vue-admin-template 中的导航栏 hover 样式，可以按照以下步骤操作：

1. 打开 `src/styles/element-variables.scss` 文件，找到 `$--color-primary-hover` 变量，将其值修改为你想要的颜色值。

2. 打开 `src/styles/mixins.scss` 文件，找到 `el-menu-item-active` 类的样式，修改其中的 `background-color` 和 `border-color` 属性为你想要的颜色值。

3. 打开 `src/layout/components/Sidebar/index.vue` 文件，找到 `<el-menu>` 标签，将其中的 `@hover-background-color` 属性值修改为 `$--color-primary-hover`。

这样就可以修改 vue-admin-template 中导航栏 hover 样式了。记得重新编译项目以使修改生效。

相关问题

vue-element-admin顶部导航栏

vue-element-admin的顶部导航栏可以通过修改导航栏组件的mode属性来实现。你可以将mode属性设置为"horizontal"这样导航栏就会以水平方式显示。[1]在项目中，你可以使用vue-admin-template作为基础模板进行改造，以满足顶部导航菜单和侧边导航相结合的需求。[2]具体操作是复制一份@/views/layout/Sidebar组件，将其粘贴到相同路径下，并将组件名改为HeadNavbar。然后在index.js中声明该组件，并修改@/views/layout/HeadNavbar/index.vue文件中的template部分，将el-menu的mode属性设置为"horizontal"。这样就可以实现顶部导航栏的效果了。[3]

vue-admin-template和vue-element-admin

vue-admin-template和vue-element-admin是两个不同的项目。

vue-admin-template是一个基于vue-element-admin的后台管理系统基础模板，可以作为模板进行二次开发。它提供了一个简洁的基础框架，适合用于中小型后台管理项目的开发。你可以从GitHub上获取它的源代码，GitHub地址是https://github.com/PanJiaChen/vue-admin-template 。

而vue-element-admin是一个丰富的组件库，它包含了很多常用的组件和功能，可以作为一个工具箱。你可以从vue-element-admin中复制你需要的功能或组件到vue-admin-template中进行二次开发。这样可以加快开发速度，并且确保功能的完整性和稳定性。

总结起来，vue-admin-template是一个基础的后台管理系统模板，适合二次开发，而vue-element-admin是一个组件库，可以作为工具箱供开发者使用。