关于 mat-card-title 未对齐中心
Regarding mat-card-title not aligning center
我使用了 mat-card,因为我使用了 mat-card-title,因为我使用了 style="text-align:center";
但它没有对齐中心
<mat-card style="text-align: center;">
<mat-card-header >
<mat-card-title style="text-align: center;">
spreadsheet
</mat-card-title>
</mat-card-header>
<mat-card-content>
<div id="spreadsheet"></div>
</mat-card-content>
</mat-card>
这是浏览器的截图:
文本对齐无效,因为 mat-header 标签只有其内容的宽度。你可以这样试试
<mat-card >
<div style="text-align:center;">
<mat-card-title>spreadsheet</mat-card-title>
</div>
<mat-card-content>
<div id="spreadsheet">
</div>
html 文件:
<mat-card class="title_center">
<mat-card-title>spreadsheet</mat-card-title>
</mat-card>
css 文件:
.title_center {
display: flex;
justify-content: center; /* align horizontal */
align-items: center; /* align vertical */
}
我使用了 mat-card,因为我使用了 mat-card-title,因为我使用了 style="text-align:center";
但它没有对齐中心
<mat-card style="text-align: center;">
<mat-card-header >
<mat-card-title style="text-align: center;">
spreadsheet
</mat-card-title>
</mat-card-header>
<mat-card-content>
<div id="spreadsheet"></div>
</mat-card-content>
</mat-card>
这是浏览器的截图:
文本对齐无效,因为 mat-header 标签只有其内容的宽度。你可以这样试试
<mat-card >
<div style="text-align:center;">
<mat-card-title>spreadsheet</mat-card-title>
</div>
<mat-card-content>
<div id="spreadsheet">
</div>
html 文件:
<mat-card class="title_center">
<mat-card-title>spreadsheet</mat-card-title>
</mat-card>
css 文件:
.title_center {
display: flex;
justify-content: center; /* align horizontal */
align-items: center; /* align vertical */
}