选中样式调整

src/page/index/top/top-menu.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <el-menu class="top-menu" :default-active="activeIndex" mode="horizontal" text-color="#333" ellipsis
+    <el-menu class="top-menu custom-menu" :default-active="activeIndex" mode="horizontal"  ellipsis
       style="width: 900px" >
       <!-- <el-menu-item index="0" @click="openHome(itemHome)">
       <template #title>
@@ -147,4 +147,26 @@ export default {
     }
   }
 }
+
+// :deep(.el-menu--horizontal>.el-menu-item.is-active) {
+//   background-color: #dceeff !important;
+// }
+.custom-menu .el-menu-item.is-active {
+  background-color: #f3f3f3 !important; /* 修改选中项的背景色 */
+}
+
+/* 如果需要修改选中时span标签的文字颜色，可以嵌套样式 */
+.el-menu-item.is-active span {
+  color: #fff !important;
+}
+
+
+:deep(.el-menu-item.is-active i) {
+  color: #06f !important;
+}
+
+:deep(.el-menu-item.is-active span) {
+  color: #06f !important;
+}
+
 </style>

src/styles/element-ui.scss

@@ -37,7 +37,7 @@
 
 
 .el-dropdown-menu__item--divided:before, .el-menu, .el-menu--horizontal > .el-menu-item:not(.is-disabled):focus, .el-menu--horizontal > .el-menu-item:not(.is-disabled):hover, .el-menu--horizontal > .el-sub-menu .el-sub-menu__title:hover {
-  background-color: transparent !important;
+  background-color: transparent ;
 }
 
 .el-collapse-item__header {