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 ...
随机推荐
- Time类
public class Demo_Timer { /** * @param args * 计时器 * @throws InterruptedException */ public static vo ...
- QML加载gif
AnimatedImage { anchors.fill: parent source: "qrc:/img/timg.gif" }
- Node.jsp配环境更新中)
设置用户密码sudo passwd user1sudo passwd root 创建新用户sudo useradd -d /home/share -m sharesu share设置新用户密码sudo ...
- 使用PHP实现命令模式(转)
<?php /** * 命令模式 2010-08-21 sz * @author phppan.p#gmail.com http://www.phppan.com * 哥学社成员(http:// ...
- DTCMS会员中心添加新页面
首先将模板文件spend_list.html放到模板文件夹 URL配置里 将需要在此页面传递的参数,在“添加表达式”中配置好 链接写法: 继承类名DTcms.Web.UI.Page.spend_lis ...
- 金仓Kingbase数据库网页数据维护分析工具
金仓Kingbase是优秀的国产数据库产品,在能源,政务,国防等领域广泛使用, 现在TreeSoft数据库管理系统已支持Kingbase了,直接在浏览器中就可以操作查看Kingbase数据了,十分方便 ...
- 【c# 学习笔记】继承
在c#中,一个类可以继承另外一个已有的类(密封类除外),被继承的类称为基类(或父类),继承的类称为派生类(或子类),子类将获得基类 除构造函数和析构函数以外的所有成员.此外,静态类是密封的,也不能被继 ...
- CommMonitor10.0.3串口过滤工具(serial port monitor)
CommMonitor 串行端口监视精灵是用于RS232 / RS422 / RS485端口监控的专业强大的系统实用程序软件.CommMonitor监视显示,记录和分析系统中的所有串行端口活动.这是 ...
- jsp标签在spring boot中的关键用法
<form:form modelAttribute="user" action="save" method="post" >// ...
- Node中导入模块require和import??
转自:https://blog.csdn.net/wxl1555/article/details/80852326 S6标准发布后,module成为标准,标准的使用是以export指令导出接口,以im ...