vue.js

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript类库 > vue.js > el-menu修改item颜色

el-menu修改item颜色的实现

作者:bu_xiang_tutou

本文主要介绍了el-menu修改item颜色的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

本文主要介绍了el-menu修改item颜色的实现,具体如下:

 今天在在点击el-menu的一级菜单和二级菜单出现了点击成白色,刚好我设置的文字颜色也是白色,就变成什么都看不见了。

//设置一级菜单和二级菜单的背景颜色
.el-sub-menu .el-menu-item {
  background-color: RGB(38,87,227) !important;
}
//设置选鼠标指针浮动在一级菜单的设置
.el-menu-item:hover{
  background-color: aqua !important;;
}
//设置当前被选中的一级菜单
.el-menu-item.is-active {  
  color: #fff !important;  
  background: black !important;  
}  
 

但是当我使用,下面的代码去修改二级菜单的鼠标浮点事件的时候,我设置的背景颜色就只出现在我鼠标浮动的那个时刻。

.el-sub-menu:hover{
  background-color: aqua !important;;
}

要设置二级菜单的触发背景颜色的时候,应使用项目的代码

.el-sub-menu:hover{
  background-color: aqua !important;;
}
.el-sub-menu__title:focus, .el-sub-menu__title:hover{  
  background-color: aqua !important;;
} 

到此这篇关于el-menu修改item颜色的实现的文章就介绍到这了,更多相关el-menu修改item颜色内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能感兴趣的文章:
阅读全文