正确的、非显而易见的方法是使用CSS shadow parts。
在这种情况下，ion-img有一个阴影部分image，所以我们的SCSS看起来像：

ion-img::part(image) {
  border-radius: 10px;
}

是的，该部分没有引号，是完整的单词“image”（不是“img”，我们需要的是部分名称，而不是目标标记名称）。

HTML

<ion-img [src]="img-url" class="your-img"></ion-img>

CSS

.your-img {
    border-radius: 10px !important;
    overflow: hidden;
}

1.把图像放在卡片里面

<ion-card>
        <ion-img  src="imag"></ion-img>                      
    </ion-card>

1.之后，设置图像的样式
1.在ion-img样式中将图像与高度设置为100%
1.修改离子卡组件中的半径值

您可以用途：

<ion-avatar>
   <ion-img [src]="item.image"></ion-img>
</ion-avatar>`

ion-avatar {
    --border-radius: 10px;
}

我在

中找到了这个解决方案

用Shadow DOM封装样式是很棘手的，但是有很多方法。
在这种情况下，它对内联样式属性有用吗？

<ion-img [src]="img-url" [alt]="alt" [style]="border-radius: 10px;"></ion-img>

否则，您可以尝试使用边界半径向Shadow DOM的内部HTML添加<style></style>标记。
一个修改后的例子从附加链接：

const host = document.getElementById('shadow-host');

host.shadowRoot.innerHTML = `
<style>
  img {
    border-radius: 10px;
  }
</style>
`

您可以在<ion-thumbnail>中使用<ion-img>，并且样式效果很好。超文本标记语言：

<ion-thumbnail slot="start">
      <ion-img src='/assets/avatar-images/defaultuser.png'"></ion-img>
    </ion-thumbnail>

CSS：

ion-thumbnail {
          --border-radius: 10px;
          border: 1px solid var(--grayColor);
          
        }

下面的解决方案适用于我：

<ion-img class="car-image"
      src="https://docs-demo.ionic.io/assets/madison.jpg"
      alt="The Wisconsin State Capitol building in Madison, WI at night">
</ion-img>

SCSS：

ion-img::part(image) {
    border-radius: 10px;
    box-shadow: 1px 1px 1px 1px transparent;
}

输出：