1 修改导航栏的文字大小、 善用F12+ctrlshiftC 比如想改菜单的字体大小,直接F12点击字体: 可以看到该组件对应的类名是el-menu-item,我们在右边的Styles中找到这个类,果然发现了它对应的样式: 我们直接就在页面上修改该样式,增加一个字体大小: 所以我们发现了对应导航栏这种框框里面的内容样式,需要修改的就是.el-m...
<el-menu-item index="2-1"><a class="item" href="javascript:void(0);">选项1</a></el-menu-item> <el-menu-item index="2-2"><a class="item" href="javascript:void(0);">选项2</a></el-menu-item> <el-menu-item index="2-3"><a class="item" href="javascript:void(0);">...
el-menu-item 修改el-menu项的高度 el-sub-menu 修改el-menu的下拉高度
确定需要修改的el-menu样式属性: 你可能需要修改菜单的背景颜色、文字颜色、字体大小、边框、间距等属性。 查找对应的CSS类名或选择器: 使用浏览器的开发者工具(通常可以通过按 F12 打开)来检查 el-menu 组件的DOM结构和CSS样式。 常见的类名包括 .el-menu、.el-menu-item、.el-submenu 等。 编写CSS规则以...
//设置一级菜单和二级菜单的背景颜色.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: bl...
1. 修改menu样式 2. 修改App.vue 样式 3. 路由 a、 添加事件 b、更改Home为Main.vue c、移动views/user/index.vue d、新建views/home/index.vue ...
并给它加上背景色，发现仍有一条细小的白线。4 再跟踪修改这个背景色，至此修改完成。5 总结起来，修改el-dropdown-menu的背景色大致需要修改的背景色有：el-dropdown-menu标签上的背景色，样式名.el-dropdown-menu__item--divided:before的背景色和样式名.el-dropdown-menu__item--divided的边框色 ...
ElMenuItem, ElIcon, ElBreadcrumb, ElBreadcrumbItem, ElCard, ElCol, ElTableColumn, ElTable, ElSwitch } from 'element-plus' import { Location, Menu as IconMenu, Search } from '@element-plus/icons' import { ArrowRight } from '@element-plus/icons-vue' ...
--同样是将append-to-body参数设置为false--><el-dropdown-menuslot="dropdown":append-to-body="false"ref="downdiv"><el-dropdown-item>黄金糕</el-dropdown-item><el-dropdown-item>狮子头</el-dropdown-item><el-dropdown-item>螺蛳粉</el-dropdown-item><el-dropdown-itemdisabled>双皮奶</el-...
/*主菜单样式*/>>>.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...