elementui更改導航欄樣式

 

 本來是這樣，有下划線有點擊背景，但是業務需求不需要，就想辦法進行隱藏，控制台可以觀察效果找出相應的類進行格式書寫

以下效果：

 

 放上代碼

<style>
.el-menu-demo{
    height: 40px;
    /* border-bottom-color:none!important; */
    background-color:rgba(0,0,0,0);
    float:right;
    margin-right: 8.54%;

}
/* 點擊出來的下划線進行隱藏 */
.el-menu-item.is-active {
    border-bottom: none!important;
    color: rgba(0,0,0,0);
}
/* 整體的下划線進行隱藏 */
.el-menu.el-menu--horizontal{
  border-bottom: none;
}
/* 導航欄的間距等樣式 */
.el-menu-item {
  padding: 0 62px;
  font-size: 16px;
}

/* 點擊出來的下划線動效殘留進行隱藏 */
.el-menu--horizontal>.el-menu-item{
    border-bottom: none;
}
/* 點擊以后的背景色進行隱藏 */
.el-menu--horizontal>.el-menu-item:not(.is-disabled):focus, .el-menu--horizontal>.el-menu-item:not(.is-disabled):hover, .el-menu--horizontal>.el-submenu .el-submenu__title:hover {
    background-color: rgba(0,0,0,0);
}
</style>