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顏色內容請搜索WalkonNet以前的文章或繼續瀏覽下面的相關文章希望大傢以後多多支持WalkonNet!

推薦閱讀: