本来是这样,有下划线有点击背景,但是业务需求不需要,就想办法进行隐藏,控制台可以观察效果找出相应的类进行格式书写

以下效果:

放上代码

<style>
.el-menu-demo{
height: 40px;
/* border-bottom-color:none!important; */
background-color:rgba(,,,);
float:right;
margin-right: 8.54%; }
/* 点击出来的下划线进行隐藏 */
.el-menu-item.is-active {
border-bottom: none!important;
color: rgba(,,,);
}
/* 整体的下划线进行隐藏 */
.el-menu.el-menu--horizontal{
border-bottom: none;
}
/* 导航栏的间距等样式 */
.el-menu-item {
padding: 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(,,,);
}
</style>

elementui更改导航栏样式的更多相关文章

  1. iOS学习——更改导航栏的返回按钮的标题与颜色

    转载自:修改navigationController返回按钮颜色和文字 今天在做项目时遇到这个问题,试了很多方法都失败了.最后终于找到正确的方案了,在这里分享给大家. 引言 在iOS开发过程中,Nav ...

  2. 更改导航栏的背景和文字Color

    更改导航栏的背景和文字Color方法一: [objc] view plaincopy//set NavigationBar 背景颜色&title 颜色  [self.navigationCon ...

  3. Bootstrap -- 导航栏样式、分页样式、标签样式、徽章样式

    Bootstrap -- 导航栏样式.分页样式.标签样式.徽章样式 1. 使用图标的导航栏 使用导航栏样式: <!DOCTYPE html> <html> <head&g ...

  4. element-ui使用导航栏跳转路由用法

    element-ui使用导航栏跳转路由用法 最近初学vue,试着做一个小项目熟悉语法与思想,其中使用elemen-ui的导航栏做路由跳转切换页面.下面记录一下学习过程 element-ui引入vue项 ...

  5. 微信小程序------导航栏样式、tabBar导航栏

    一:导航栏样式设置 小程序的导航栏样式在app.json中定义. 这里设置导航,背景黑色,文字白色,文字内容测试小程序 app.json内容: { "pages":[ " ...

  6. 微信小程序入门四: 导航栏样式、tabBar导航栏

    实例内容 导航栏样式设置 tabBar导航栏 实例一:导航栏样式设置 小程序的导航栏样式在app.json中定义. 这里设置导航,背景黑色,文字白色,文字内容测试小程序 app.json内容: { & ...

  7. React Navigation 导航栏样式调整+底部角标消息提示

    五一佳节匆匆而过,有人选择在外面看人山人海,有人选择宅在家中度过五一,也有人依然坚守在第一线,致敬! 这是坚持学习react-native的第二篇文章,可能会迟到,但是绝不会缺席,这篇要涉及到的是re ...

  8. elementUI的导航栏在刷新页面的时候选中状态消失的解决

    首先elementUI的导航栏中的选中项的高亮显示时的字体颜色可以在属性中设置,但是高亮时的背景颜色不能设置,所以要自己修改高亮的背景颜色 .el-menu-item.is-active { back ...

  9. React-Native 之 GD (二)自定义共用导航栏样式

    1.自定义导航栏样式 步骤一:从效果图中可以看出,导航栏的样式都差不多,因为我们前面已经设置了 Navigator ,这边的话我们还需要自定义 Navigator 的样式,可以看到所有的 Naviga ...

随机推荐

  1. @Deprecated注解

    它的作用是对不应该再使用的方法添加注解,当编程人员使用这些方法时,将会在编译时显示提示信息,它与javadoc里的@deprecated标记有相同的功能,准确的说,它还不如javadoc @depre ...

  2. 微软代码示例:ASP.NET 2.0 三层架构应用程序教程系列

    本文转自:http://www.codeusing.com/hi/uephee.wen/resource/view/170.aspx 资源分类:微软代码示例               更新日期:20 ...

  3. Java 5-11新特性的整理(转)

    Java 5-11新特性的整理(转) 作者:拔剑少年 简书地址:https://www.jianshu.com/u/dad4d9675892博客地址:https://it18monkey.github ...

  4. spark "main" java.lang.ArrayIndexOutOfBoundsException: 10582

    升级 你的 paranamer 到2.8 ,这是由于你的jdk版本1.8导致 <!-- https://mvnrepository.com/artifact/com.thoughtworks.p ...

  5. 自定义string类

    #include <iostream> #include <cstring> using namespace std; class String; class Data{ // ...

  6. 编译安装python3事出错:

    configure: error: no acceptable C compiler found in $PATH 问题解决 解决方法: yum intall gcc -y

  7. LeetCode_70. Climbing Stairs

    70. Climbing Stairs Easy You are climbing a stair case. It takes n steps to reach to the top. Each t ...

  8. LeetCode_67. Add Binary

    67. Add Binary Easy Given two binary strings, return their sum (also a binary string). The input str ...

  9. (四)UML之顺序图(时序图)

    一.概念 顺序图是交互图的一种形式,它显示对象沿生命线发展,对象之间随时间的交互表示为从源生命线指向目标生命线的消息.顺序图能很好地显示那些对象与其它那些对象通信,什么消息触发了这些通信,顺序图不能很 ...

  10. ubuntu18.04中将刚下载解压的eclipse添加到启动器

    在/usr/share/applications/目录下新建一个名为eclipse.desktop的文件. 文件内容如下: [Desktop Entry] Version=2018.09 Name=E ...