如何在材质设计中更改md-toolbar的高度?
http://jsfiddle.net/kostonstyle/gsroofa5/
在第一个工具栏上,我想要一个30px的高度并尝试:
<md-toolbar style:"height: 30px;">
但它根本不起作用。我需要一个带有两个散装的导航栏,因为有两个工具栏。
我试试这个,但现在信件消失了。
答案 0 :(得分:13)
您可以使用这样的内联样式
<md-toolbar style="min-height:30px">
使用 min-height 使工具栏变小
答案 1 :(得分:10)
可以通过将类添加到md-toolbar
来更改工具栏的高度。
对于中型工具栏,请添加class="md-medium-tall"
对于大于正常情况的工具栏,添加class="md-tall"
您还可以为工具栏style="height:50px;"
答案 2 :(得分:2)
接受的答案对我不起作用。这是我如何在Angular Material应用中运行它的方法:
<mat-toolbar color="primary"
style="min-height: 30px !important; height: 30px !important;">
答案 3 :(得分:2)
这在Angular 8上对我有用。将这段代码放在您的scss中
.mat-toolbar {
min-height: 50px !important;
height: 50px !important;
}
.mat-toolbar-row {
min-height: 50px !important;
height: 50px !important;
}
用'md'替换'mat'
答案 4 :(得分:0)
如果仅设置min-height
无效,就像它对我不起作用一样,您还必须在max-height
中添加相同的值:
HTML
<md-toolbar class="toolbar"></md-toolbar>
CSS
.toolbar {
max-height: 30px;
min-height: 30px;
}