elementui更改导航栏样式

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

放上代码
<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更改导航栏样式的更多相关文章
- iOS学习——更改导航栏的返回按钮的标题与颜色
转载自:修改navigationController返回按钮颜色和文字 今天在做项目时遇到这个问题,试了很多方法都失败了.最后终于找到正确的方案了,在这里分享给大家. 引言 在iOS开发过程中,Nav ...
- 更改导航栏的背景和文字Color
更改导航栏的背景和文字Color方法一: [objc] view plaincopy//set NavigationBar 背景颜色&title 颜色 [self.navigationCon ...
- Bootstrap -- 导航栏样式、分页样式、标签样式、徽章样式
Bootstrap -- 导航栏样式.分页样式.标签样式.徽章样式 1. 使用图标的导航栏 使用导航栏样式: <!DOCTYPE html> <html> <head&g ...
- element-ui使用导航栏跳转路由用法
element-ui使用导航栏跳转路由用法 最近初学vue,试着做一个小项目熟悉语法与思想,其中使用elemen-ui的导航栏做路由跳转切换页面.下面记录一下学习过程 element-ui引入vue项 ...
- 微信小程序------导航栏样式、tabBar导航栏
一:导航栏样式设置 小程序的导航栏样式在app.json中定义. 这里设置导航,背景黑色,文字白色,文字内容测试小程序 app.json内容: { "pages":[ " ...
- 微信小程序入门四: 导航栏样式、tabBar导航栏
实例内容 导航栏样式设置 tabBar导航栏 实例一:导航栏样式设置 小程序的导航栏样式在app.json中定义. 这里设置导航,背景黑色,文字白色,文字内容测试小程序 app.json内容: { & ...
- React Navigation 导航栏样式调整+底部角标消息提示
五一佳节匆匆而过,有人选择在外面看人山人海,有人选择宅在家中度过五一,也有人依然坚守在第一线,致敬! 这是坚持学习react-native的第二篇文章,可能会迟到,但是绝不会缺席,这篇要涉及到的是re ...
- elementUI的导航栏在刷新页面的时候选中状态消失的解决
首先elementUI的导航栏中的选中项的高亮显示时的字体颜色可以在属性中设置,但是高亮时的背景颜色不能设置,所以要自己修改高亮的背景颜色 .el-menu-item.is-active { back ...
- React-Native 之 GD (二)自定义共用导航栏样式
1.自定义导航栏样式 步骤一:从效果图中可以看出,导航栏的样式都差不多,因为我们前面已经设置了 Navigator ,这边的话我们还需要自定义 Navigator 的样式,可以看到所有的 Naviga ...
随机推荐
- bing map for wpf 怎么显示中文地图
添加一下代码: string suriFormat = "http://r2.tiles.ditu.live.com/tiles/r{quadkey}.png?g=41"; Mic ...
- java从包package中获取所有的Class
1.从包package中获取所有的Class方法: /** * 从包package中获取所有的Class * @param pack * @return */ public static List ...
- Maven打包SpringBoot
Pom文件提交plugin <build> <finalName>Site</finalName><!--文件名可自定义--> <plugins& ...
- 三个线程abc顺序执行
1.使用synchronized悲观锁(秋招阿里的一个笔试题,应该写的比较复杂,然后就没有然后了o(╥﹏╥)o) public class ThreadThreadp { private int fl ...
- Js 实现局部打印功能
1.当前页面 var bodyHtml = window.document.body.innerHTML; window.document.body.innerHTML = printHtml;//p ...
- MySQL创建及删除临时表
示例SQL: drop temporary table if exists testdb.tmp_test_table; create temporary table testdb.tmp_test_ ...
- PostgreSQL学习笔记——摘要
因为PostgreSQL和MySQL.DB2等数据库均遵循SQL语法,所以这篇随笔仅记录一些PostgreSQL中和别的数据库有差别或之前学习中遗漏的地方,以及一些我觉得比较重点的地方. 通过psql ...
- 《CNCF × Alibaba云原生技术公开课》知识点自测(二):容器基本概念
(单选)1.已运行 docker run -d -t —name demo ubuntu top 和 docker run --name demo-x --pid container:demo ubu ...
- 实现一个Promise
实现一个Promise promise特点 一个promise的当前状态只能是pending.fulfilled和rejected三种之一.状态改变只能是pending到fulfilled或者pend ...
- python全栈索引
书签 python基础 太白金星 TigerLee python基础一 pytcharm安装详细教程 python基础二 python基础数据类型 Python最详细,最深入的代码块小数据池剖析 深浅 ...