gpt4 book ai didi

angular - 使用具有两列的 Angular 列表

转载 作者:行者123 更新时间:2023-12-03 22:02:37 25 4
gpt4 key购买 nike

我如何使用 angular lists左右两列文本?
angular 网站上显示的基本示例如下:

<mat-list>
<mat-list-item> Pepper </mat-list-item>
<mat-list-item> Salt </mat-list-item>
<mat-list-item> Paprika </mat-list-item>
</mat-list>
我想在每个 <mat-list-item> 中拆分文本在两列上显示(左右对齐)
我尝试了几种方法,包括:
<mat-list>
<mat-list-item>
<p style="float:left">Left Text</p>
<p style="float:right">Right Text</p>
</mat-list-item>
<mat-list-item>
<p style="float:left">Left Text</p>
<p style="float:right">Right Text</p>
</mat-list-item>
</mat-list>
但似乎没有一个工作。
如何在不使用网格列表的情况下实现这一目标?

最佳答案

您必须使用 matLine在你的代码中使其工作。像这样尝试,它会起作用。

<mat-list>
<mat-list-item >
<div matLine>
<p style="float:left">Left Text</p>
<p style="float:right">Right Text</p>
</div>
</mat-list-item>
<mat-list-item>
<div matLine>
<p style="float:left">Left Text</p>
<p style="float:right">Right Text</p>
</div>
</mat-list-item>
</mat-list>

关于angular - 使用具有两列的 Angular 列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58833607/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com