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!
推薦閱讀:
- vue實現多級側邊欄的封裝
- element-UI el-table樹形數據 修改小三角圖標方式
- vue遞歸組件實現elementUI多級菜單
- Vue router/Element重復點擊導航路由報錯問題及解決
- el-menu動態加載路由的實現