ion-img 边框半径 - CSS

ion-img 是一个 web 组件，用于在 Ionic 框架中展示图像。通过 CSS 可以定制 ion-img 的样式。其中一个可定制的样式是边框半径。

CSS 属性：border-radius

border-radius 属性用于设置元素的边框半径。其语法如下：

border-radius: <length> | <percentage> | inherit

其中，<length> 和 <percentage> 都用于定义边框半径。使用 <length> 时，取值为像素、英寸、厘米等等长度单位。例如：border-radius: 5px。使用 <percentage> 时，取值为相对于元素宽度的百分比。例如：border-radius: 50%。

在 ion-img 中设置边框半径

下面是如何在 ion-img 中设置边框半径的 CSS 代码示例：

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

此代码会将 ion-img 边框半径设置为 10 像素。如果要使用百分比作为边框半径，可以使用以下代码：

ion-img {
  border-radius: 50%;
}

此代码会将 ion-img 边框半径设置为元素宽度的一半。如果要让 ion-img 边框半径呈现出圆形，可以将百分比设置为 50%。

总结

ion-img 是在 Ionic 框架中用于显示图像的 web 组件。边框半径可以通过 CSS 中的 border-radius 属性来设置。在 ion-img 中设置边框半径的示例代码已经在本文中给出。