Ionic 2文本换行字体大小

Question

Ionic 2 app - 我有一个项目列表，我使用text-wrap来避免文字切断时增加字体大小但是当使用text-wrap属性时字体似乎回到我假设的text-wrap属性的默认大小。如何更改text-wrap（默认）字体大小？

字体大小增加 - 没有文字换行：

字体大小增加 - 使用文字换行：

HTML

  <ion-list text-wrap>
    <div *ngFor="let item of menuItems">
      <button ion-item (click)="goToPageFn(item)" class="app-font-25">
        <b>{{item.name}}</b>
      </button>
    </div>
  </ion-list>

CSS： [edit]

text-wrap {
    font-size: 25px;
}
.app-font-25 {
    font-size: 25px;
}

Answer 1

Ionic2有内置的css for button，这使得它不会包装文本内容。如果您想要更改文本的大小以及包装它，请修改您的代码，如下所示

<ion-list>
    <div *ngFor="let item of menuItems">
        <button ion-item (click)="goToPageFn(item)" class="app-font-25">
            <b>{{item.name}}</b>
        </button>
    </div>
</ion-list>

你的CSS：

.app-font-25 ion-label{
    white-space: inherit;
    font-size: 25px;
  }

你的html和css都不需要

text-wrap 。