ベストアンサー1
更新 - これはAngular 15以降では機能しないようです
Angular の最新バージョン (15 以降?) では、これはもう機能しないようです。代わりに @Neistow の回答を参照してください。https://stackoverflow.com/a/75194777/400790
プレAngular15
要約:周囲のコンテナのフォント サイズを調整します。
より長いです:フォームフィールドのサイズを変更する機能はAngular Materialに組み込まれているため、フィールド内の相対的な比率を変更したくない場合は、個々のコンポーネントのサイズを変更する必要はありません(ドキュメントを参照)。
フィールドサイズを調整する鍵は、実際には周囲のコンテナのフォントサイズを調整することです。これを実行すると、他のすべてがそれに合わせて拡大縮小されます。例:
コンテナの font-size: 12px;
<div style="font-size: 12px">
<mat-form-field appearance="outline">
<mat-label>Your name</mat-label>
<input matInput placeholder="Jane Doe">
</mat-form-field>
<mat-form-field appearance="outline">
<mat-label>Your email</mat-label>
<input matInput placeholder="[email protected]">
</mat-form-field>
</div>
結果形式:
コンテナの font-size: 18px;
<div style="font-size: 18px">
<mat-form-field...
</div>
結果形式:
注意
フォーム内のパディングの比率に満足できない場合、これは解決策ではありません。ただし、これはフォームのサイズを変更する方法とは別の問題です。サイズ変更は簡単ですが、パディングとマージンの比率を変更するのはより困難です。