1. 确定el-menu激活时的默认颜色 el-menu是Element UI库中的一个组件,其激活时的默认颜色由Element UI的样式表定义。通常,激活的菜单项会有一个is-active类。 2. 查找el-menu激活颜色相关的CSS类或样式 激活的菜单项通常会有.el-menu-item.is-active这个类。你可以通过浏览器的开发者工具来检查这个类的样式...
active-text-color 是选中的文本颜色 这句话设置选中的背景颜色 .el-menu-item.is-active { background-color: #ccff00!important; } <template><divclass="common-layout"><!--全屏的关键:height:100vh--><el-containerstyle=" height: 100vh"><el-asidestyle="background-color: #191970;"width="200p...
具体效果如下: 今天在在点击el-menu的一级菜单和二级菜单出现了点击成白色,刚好我设置的文字颜色也是白色,就变成什么都看不见了。 //设置一级菜单和二级菜单的背景颜色.el-sub-menu.el-menu-item{background-color:RGB(38,87,227)!important; } //设置选鼠标指针浮动在一级菜单的设置.el-menu-item:hover{ba...
landlordlycat Sep 7, 2023 我今天也遇到这问题了,不过应该不是你这样理解的,文字颜色(十六进制格式)(已被废弃,使用--text-color)--text-color应该是让你声明一个css变量,从里面抽离出来。不直接在上面写text-color=“不直接写十六进制” 而是text-color=“var(--text-color)” style里面就写例如el-menu(...
<el-menu<!--依次为菜单背景颜色、字体颜色、激活时颜色-->background-color="#2F4050" text-color="#9CB4CC" active-text-color="white" ... ><el-submenu><el-menu-item>...</el-menu-item></el-submenu></el-menu> html中已经实现了菜单的主体样式,细节样式通过下述css实现。
1、router属性,若使用router属性menu-item的index将对应router的path属性 2、mode,下拉菜单的模式分为horizontal和vertical两种模式 3、background-color,background-color属性为下拉菜单整体的背景颜色 4、text-color,text-color为下拉菜单中的文字的颜色 5、active-text-color为选中的菜单的颜色 ...
如果点击el-menu-item后,此时存在另外一个el-sub-menu,不点击el-sub-menu,而是指针移动到上面并弹出下拉栏时,点击其中的el-menu-item,此时之前的el-menu-item的背景颜色仍然存在,而不会消失。 Additional comments (empty)
el-menu菜单标签(⾥⾯可以包括:el-submenu和el-menu- item)<el-menu> 1、router属性,若使⽤router属性menu-item的index将对应router的path属性 2、mode,下拉菜单的模式分为horizontal和vertical两种模式 3、background-color,background-color属性为下拉菜单整体的背景颜⾊ 4、text-color,text-color为下拉...
选某选的第一个,其它的项第一个的文字颜色也跟着一起修改了,这是哪里设置错了? <el-menu class="el-menu-vertical-demo" @open="menuChange" @select="gotoUrl" @close="handleClose" background-color="#304156" text-color="#BFCBD9" active-text-color="#1890ff"> <div v-for="(item, index) ...
主要是设置 .el-menu-item.is-active 选择器的样式属性 官方文档中提供background-color、text-color、active-text-color三种属性 仅提供了激活菜单文字颜色,并没有提供激活菜单的其他参数 <el-menudefault-active="0"class="el-menu-vertical-demo"@open="handleOpen"@close="handleClose":collapse="collapsed"back...