<mat-card fxLayout="row wrap" fxFlex.sm="60" fxFlexOffset.sm="20" fxFlex.md="60" fxFlexOffset.md="20" fxFlex.lg="40" fxFlexOffset.lg="30"
fxFlex.xl="40" fxFlexOffset.xl="30">
<mat-card-content>
<form [formGroup]="messageForm" class="example-form">
<mat-form-field style="width: 100%;" fxFlex="20" fxFlex.sm="100">
<input matInput formControlName="title" name="title" placeholder="Enter your title">
</mat-form-field>
<mat-form-field style="width: 100%;" fxFlex="80" fxFlex.sm="100">
<input matInput formControlName="content" name="content" placeholder="Enter your message">
</mat-form-field>
</form>
</mat-card-content>
<mat-card-actions>
<button mat-button>
<mat-icon>send</mat-icon> Send
</button>
</mat-card-actions>
</mat-card>
为什么屏幕尺寸为“sm”时。 mat-form-field应为fxflex =“100”,但另一个mat-form-field不会出现故障。它将显示为50/50。如果屏幕很小,我想实现。 mat-form-field的大小都是100,因此它们将消耗整行。它现在有2行而不是1行。它们的大小相同。