【发布时间】:2020-12-10 15:59:39
【问题描述】:
我正在尝试做的事情是从 API 获取国家数据并将它们全部呈现为页面上的卡片。
我在调整标志的大小时遇到了麻烦因为它们都有不同的大小。
我已将width: 100%; 应用到卡内,并将overflow: hidden 应用到其父卡。但是我尝试应用的高度不一样 min-height: 50% 并没有完全完成这项工作-
看到澳大利亚国旗了吗?它在顶部和底部有白条,而图像没有margin 等。你能告诉我如何使它们的尺寸相同吗?
https://codesandbox.io/s/fetch-countries-api-1ibwp?file=/src/index.js
【问题讨论】:
-
您遇到的问题是图像大小不同。我们不想扭曲图像,所以我唯一能想到的就是将图像作为背景封面。
-
@CyrusZei 我想到了这一点,但由于我正在获取数据并将其映射到组件,因此我无法访问 sass 中的图像 URL。为脚本中的每个数据项设置背景会很麻烦,所以我正在寻找一个只使用样式表的更简单的解决方案!