是否可以使 md 按钮更小? [英] Is it possible to make an md-button smaller?
本文介绍了是否可以使 md 按钮更小?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我希望显示左右箭头和 NOW 文本的按钮尽可能小.我该怎么做?
<md-datepicker ng-model="activeDate" md-placeholder="输入日期" ng-change="changeDate()"></md-datepicker><div><md-button class="md-raised" ng-click="prev()"><</md-button><md-button class="md-raised" ng-click="changeToday()">现在</md-button><md-button class="md-raised" ng-click="next()">></md-button>
在当前的解决方案中,按钮将像在 layout="column"
中一样排列,即垂直.
在深入研究这种 CSS 样式之前,我只是想检查一下是否有一种首选的 Angular-Material 方式来做这件事?
解决方案
将以下内容添加到您的样式中:
.md-button {最小宽度:1%;}
或者,使用自定义类:
.md-button.md-small {最小宽度:1%;}
或者,在 Angular Material 2 中:
.mat-button.mat-small {最小宽度:1%;}
I want my buttons showing left- and right arrow and NOW text to be as small as possible. How do I do that?
<div ng-controller="DateCtrl" layout="row" flex>
<md-datepicker ng-model="activeDate" md-placeholder="Enter date" ng-change="changeDate()"></md-datepicker>
<div>
<md-button class="md-raised" ng-click="prev()"><</md-button>
<md-button class="md-raised" ng-click="changeToday()">NOW</md-button>
<md-button class="md-raised" ng-click="next()">></md-button>
</div>
</div>
With the current solution the buttons will be arranged as if they were in a layout="column"
, that is vertically.
Before I dig into this CSS-style, I just wanted to check if there is a preferred Angular-Material way of doing this?
解决方案
Add the following to your styles:
.md-button {
min-width: 1%;
}
Alternatively, use a custom class:
.md-button.md-small {
min-width: 1%;
}
Or, in Angular Material 2:
.mat-button.mat-small {
min-width: 1%;
}
这篇关于是否可以使 md 按钮更小?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文