ionic:如何改变FAB图标的大小

Question

我是跨平台开发人员的新手.努力改变FAB的规模.这就是我现在拥有的:

<ion-fab center middle>
<button ion-fab color="blue" class="fabStartBtn"><ion-icon 
name="start">Start</ion-icon></button>
</ion-fab>  

.fabStartBtn {
font-size: 72px;
}

但尺寸仍然相同.如何访问按钮属性？我试过id,name,#name,:之前 - 没有用.

Answer 1

进入你的theme/variables.scss文件并覆盖$fab-size变量,如下所示:

$fab-size: 70px; //Change value to whatever size you want

Answer 2

尝试使用这个：

<ion-fab center bottom>
  <button ion-fab mini><ion-icon name="add"></ion-icon></button>
</ion-fab>

如果您使用该mini属性，您可以通过以下方式修改大小：

.fab[mini] {
    margin: 8px;
    width: 40px;
    height: 40px;
    line-height: 40px;
}

如果您修改该类，您可以使 FAB 按钮更大或更小。