直播系统代码，自行更改导航栏样式

直播系统代码，自行更改导航栏样式实现的相关代码
1.添加导航栏的UI引用

app.module.tsimport { MatToolbarModule } from '@angular/material/toolbar';
import { MatIconModule } from '@angular/material/icon';
...
imports: [...MatToolbarModule,MatIconModule
]

2.用html构建导航栏

app.component.html<!-- Toolbar -->
<mat-toolbar color = "primary"><mat-toolbar-row><span>小鹰信息技术服务部数据中心</span><button mat-button>设备</button><button mat-button>用户</button></mat-toolbar-row>
</mat-toolbar><router-outlet></router-outlet>

3.为导航栏的按钮添加组件路径
导航栏的外形做好了，现在要让导航栏起作用，比如点击一个按钮就进入对应的版块。方法是为元素添加routerLink。

app.component.html<button mat-button [routerLink]="'/'" style="font-family:微软雅黑;">小鹰信息技术服务部数据中心</button>
<button mat-button [routerLink]="'/device'">设备</button>
<button mat-button [routerLink]="'/sysuser'">用户</button>

以上就是直播系统代码，自行更改导航栏样式实现的相关代码，更多内容欢迎关注之后的文章

直播系统代码，自行更改导航栏样式相关推荐

手机直播源码，底部导航栏样式
手机直播源码,底部导航栏样式我们应该在项目的res文件夹下新建一个menu文件夹,用来装menu布局文件 <?xml version="1.0" encoding=&quo ...
电商直播系统开发Android10.0 导航栏和状态栏动态控制合集
文件清单 add vendor/mediatek/proprietary/packages/apps/SystemUI/src/com/android/systemui/statusbar/phone ...
ios 系统状态栏样式修改_iOS 一种新的修改导航栏样式的方法（支持iOS10）.
iOS 一种新的修改导航栏样式的方法. 开宗明义: 对系统导航栏最底层的UIView加一层CALayer, 通过操作这个自己创建的CALayer来修改导航栏样式. 修改系统导航栏样式的几种方法 1.使 ...
导航栏样式HTML,[JavaScript 实例] 导航栏几种常见样式
这里记录下导航栏几种常见的样式,仅供大家参考. 导航栏1 (原生 JS 代码) 比较常见也比较简单的导航栏 ,用的 JavaScript 原生代码,大致思路是通过改变 li 元素的 className ...
React Navigation 导航栏样式调整+底部角标消息提示
五一佳节匆匆而过,有人选择在外面看人山人海,有人选择宅在家中度过五一,也有人依然坚守在第一线,致敬! 这是坚持学习react-native的第二篇文章,可能会迟到,但是绝不会缺席,这篇要涉及到的是re ...
三星Galaxy S20：打开手势并更改导航栏按钮顺序
Justin Duino 贾斯汀·杜伊诺(Justin Duino) Android 10 introduced a gesture-based navigation system that did ...
HTML+CSS 主页面美化的详细过程及全部代码（美化导航栏+文本框+按钮）
文章目录效果图展示前言步骤 0.创建css文件 1.美化中间板块 1.1 html改变 1.2. css部分 1.3. placeholder美化 2.增加导航栏 2.1 html文件增加代码 ...
修改bootstrap导航栏样式(颜色，高)
提示:记录bootstrap导航栏样式(颜色,高)的修改文章目录前言一.bootstrap导航栏样式 (颜色,高) 的修改前言在写自适应网页时想使用bootstrap实现,但与原稿的有一些差 ...
React-Native 之 GD （二）自定义共用导航栏样式
1.自定义导航栏样式步骤一:从效果图中可以看出,导航栏的样式都差不多,因为我们前面已经设置了 Navigator ,这边的话我们还需要自定义 Navigator 的样式,可以看到所有的 Naviga ...

直播系统代码，自行更改导航栏样式

直播系统代码，自行更改导航栏样式相关推荐

最新文章

热门文章