el-menu是Element UI库中的一个组件,其激活时的默认颜色由Element UI的样式表定义。通常,激活的菜单项会有一个is-active类。 2. 查找el-menu激活颜色相关的CSS类或样式 激活的菜单项通常会有.el-menu-item.is-active这个类。你可以通过浏览器的开发者工具来检查这个类的样式,并确定需要修改的属性。 3. 修改...
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-submenu__title{}/*主菜单悬浮样式*//deep/.el-submenu__title:hover{color:white!important;background:#1890FF!important;}/*子菜单样式*//deep/.el-menu-item{background:#283847!important;}/*子菜单悬浮样式*//deep/.el-menu-item:hover{color:white!important;background:#18...
<el-menu-item index="/fault_new/">故障诊断</el-menu-item> <el-menu-item index="/trend_new/">趋势分析</el-menu-item> <el-menu-item index="/spectrogram/">谱图分析</el-menu-item> </el-menu> data(){return{activeIndex:'/device_new/',title:'设备管理'} },mounted() {this.active...
有多种方式可以为el-menu设置不同级别的菜单项使用不同的背景色。一种简单的方式是使用scoped CSS,为每个级别的菜单项设置不同的背景色。另一种方式是使用JavaScript动态更改菜单项的类名,从而实现不同背景色的效果。如果想使用自定义CSS来实现这一效果,可以使用el-menu的slot属性来插入自定义的菜单项,并在自定义...
今天在在点击el-menu的一级菜单和二级菜单出现了点击成白色,刚好我设置的文字颜色也是白色,就变成什么都看不见了。 //设置一级菜单和二级菜单的背景颜色.el-sub-menu.el-menu-item{background-color:RGB(38,87,227)!important; } //设置选鼠标指针浮动在一级菜单的设置.el-menu-item:hover{background-color...
el-menu在使用时有一个问题选某选的第一个,其它的项第一个的文字颜色也跟着一起修改了,这是哪里设置错了? <el-menu class="el-menu-vertical-demo" @open="menuChange" @select="gotoUrl" @close="handleClose" background-color="#304156" text-color="#BFCBD9" active-text-color="#1890ff"> <div...
Bug Type: Style Environment Vue Version: 3.2.7 Element Plus Version: 2.2.25 Browser / OS: Chrome Build Tool: Vite Reproduction Related Component el-menu Reproduction Link Docs Steps to reproduce <!-- 切换成暗黑模式后 el-menu 失去背景色无法遮挡下层的元素
点击下拉栏中的el-menu-item,然后观察单独的el-menu-item的背景颜色。 What is Expected? 当点击一个el-menu-item后,背景变色,但会立即或不久消失; 当点击另外的el-menu-item时,之前所点击的el-menu-item样式应该回复原状。 What is actually happening?