[英]Angular Material Buttons not matching theme
我剛剛安裝了帶有 Angular Materials 的 Angular 10 ng add @angular/material
在那里我選擇自定義主題:紫色/綠色
下一步是簡單地添加一個工具欄,基本上是從谷歌網站復制粘貼。 但是我無法安排與主題匹配的按鈕。 我不知道為什么它看起來像這樣。
它應該看起來如何
<mat-toolbar color="primary">
<button mat-icon-button aria-label="Example icon-button with menu icon">
<mat-icon>menu</mat-icon>
</button>
<span>My App</span>
<span class="nav-spacer"></span>
<button mat-icon-button class="material-icons-outlined" aria-label="Example icon-button with heart icon">
<mat-icon>favorite</mat-icon>
</button>
<button mat-icon-button class="example-icon" aria-label="Example icon-button with share icon">
<mat-icon>share</mat-icon>
</button>
</mat-toolbar>
我的 stlye.css
/* You can add global styles to this file, and also import other style files */
html, body { height: 100%; }
body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }
我的 index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Frontend</title>
<base href="/">
<meta content="width=device-width, initial-scale=1" name="viewport">
<link href="favicon.ico" rel="icon" type="image/x-icon">
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>
<body class="mat-typography">
<app-root></app-root>
</body>
</html>
而這些進口
imports: [
BrowserModule,
BrowserAnimationsModule,
AppRoutingModule,
FormsModule,
MatToolbarModule,
MatIconModule,
],
請問我在這里想念什么?
您需要在導入中添加 MatButtonModule。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.