html - SCSS 图像失真

Question

我有一个在浏览器中显示为圆形的圆形图像。但是，当我构建 apk 并在我的 android 手机上运行它时，图像会失真(宽度大于高度)。我如何强制它保持圆形？

我正在使用 Ionic 2。

HTML:

<p class="item-selected-row search-right">
    <img class="item-stable" id="icon-image-{{subcategory.id}}" src="{{subcategory.icon}}" height="23" width="23" />
</p>

SCSS:

.item-selected-row {
    display: inline-flex;
}

.search-right {
    float: right;
}

img.item-stable {

}

Answer 1

您可以显式设置宽度和高度，例如:

img.item-stable {
  width: 50%;
  height: 50%;
}