首页 > 解决方案 > 如何设置 mat-grid-tile 的宽度

问题描述

HTML

 <mat-grid-list cols="2" [cols]="breakpoint" rowHeight="486px" (window:resize)="onResize($event)">
   <mat-grid-tile >

   </mat-grid-tile>
   <mat-grid-tile >

   </mat-grid-tile>
</mat-grid-list>

我怎样才能给第一个 30% 的宽度和mat-grid-tile第二个 70% 的宽度mat-grid-tile,以及如何设置mat-grid-tile所有设备的等效高度?

标签: angularangular-materialangular6

解决方案


您可以添加colspan. 确保 col span 的总和等于 cols Size。

<mat-grid-list cols="4" rowHeight="2:1" >
<mat-grid-tile colspan="3">1</mat-grid-tile>
<mat-grid-tile colspan="1">2</mat-grid-tile>
</mat-grid-list>

工作堆栈闪电战


推荐阅读