更改工具栏素材设计的高度

Question

如何在材料设计中更改md-toolbar的高度？

http://jsfiddle.net/kostonstyle/gsroofa5/

在第一个工具栏上,我想要一个30px的高度并尝试:

<md-toolbar style:"height: 30px;">

但它根本不起作用.我需要一个带有两个散装的导航栏,因为有两个工具栏.

我试试这个,但现在信件消失了.

http://jsfiddle.net/kostonstyle/r178sp9o/1/

Answer 1

您可以使用这样的内联样式

<md-toolbar style="min-height:30px">

使用min-height使工具栏变小

Answer 2

可以通过将类添加到工具栏来更改工具栏的高度md-toolbar.

对于中等大小的工具栏添加 class="md-medium-tall"

对于大于正常添加的工具栏 class="md-tall"

您还可以内嵌工具栏的样式 style="height:50px;"

Answer 3

接受的答案对我不起作用。这是我如何在我的 Angular Material 应用程序中使用它：

<mat-toolbar color="primary"
     style="min-height: 30px !important; height: 30px !important;">

Answer 4

这对我在 Angular 8 上有用。将此代码放入你的 scss 中

.mat-toolbar {
  min-height: 50px !important; 
  height: 50px !important;
}

.mat-toolbar-row {
  min-height: 50px !important; 
  height: 50px !important;
}

将“mat”替换为“md”