如何在elementUI中自定义菜单的bg颜色

Question

在elementUI中，默认背景颜色为白色;选择它们时：黑暗，它是黑色的，但我怎么能自己定制bg颜色？ 我试图在el-menu标签中添加样式属性，但它没有工作

<el-menu style="{background-color: rgb(36,36,36)!important}" 

我尝试找到el-menu标签的css文件的源代码，我尝试更改一些与背景颜色有关的设置，不能正常工作

菜单组件就像

有人告诉我，我可以像这样编码 <el-menu style="{backgroundColor: yello}.."但它没有用

Answer 1

该特定元素的class不可修改，请查看：

:class="{
    'el-menu--horizontal': mode === 'horizontal',
    'el-menu--dark': theme === 'dark',
    'el-menu--collapse': collapse
  }"

所以你的选择是：

1. 将其包裹在自定义<div class="my-specific-selector中并使用.my-specific-selector .el-menu
进行定位
2. 覆盖黑暗主题的CSS
3. 将组件的内容复制+粘贴到您自己的文件中，进行相应调整，然后使用它。

Answer 2

您可以尝试像这样直接放置背景颜色

<el-menu
  background-color="#304156"
  text-color="#bfcbd9"
  active-text-color="#409EFF"
  style="height: 61px;"
></el-menu>