Bootstrap 每张卡片实例图像的高度都不同

Question

我正在编写一个有角度的项目并使用 bootstrap 5。 我对

card-img-top

有疑问，因为对于用户上传的每张分辨率不同的图像，图像高度都不同。我需要实现每张图片都具有相同的宽度和高度比例或其他任何图片。 例如：https://carsandbids.com/ 具有所需的外观

下面我提供了 card.component.html 文件及其父组件的代码。 card.component.html

<div class="card h-100 content-container">
    <img src="{{auction?.imagePath}}" alt="Item Image" class="card-img-top img-fluid">
    <div class="card-body p-0">
        <div class="my-4">
            <h5 class="card-title m-0 p-0">{{auction?.title}}</h5>
            <p class="card-text"><span class="badge badge-primary m-0" *ngIf="auction?.noReserve">No Reserve</span>
                {{auction?.discription}}</p>
            <p class="card-text text-muted m-0 p-0">{{auction?.location}}</p>
        </div>
    </div>
</div>

这里是父组件文件

<main class="live-auctions col">
  <div class="auction-container">
    <div class="auction-thumbnail row g-2" *ngIf="liveAuctions != undefined && liveAuctions.length != 0">
      <app-auction-card *ngFor="let auction of liveAuctions" [auction]="auction"></app-auction-card>
    </div>
    <div class="no-auctions" *ngIf="liveAuctions == undefined || liveAuctions.length == 0">
      <p class="text-center text-muted">No Auctions Available</p>
    </div>
  </div>
</main>

感谢任何帮助:)

试过各种方案，试过h-auto, h-100, img-fluid, img-thumbnail