bulma 将图像缩放到容器

Question

我按照文档示例并将其包含在一个media对象中：

<figure class="image is-128x128">
  <img src="https://bulma.io/images/placeholders/128x128.png">
</figure>

card我将其用作显示多个元素的一部分。

问题是，当上传的图像不是平方的（意味着比例不是 1:1）时，图像会溢出容器，从而有效地破坏布局。

布尔玛有什么办法解决这个问题吗？

Answer 1

如果您为<figure>标签指定“is-square”类，这可能会解决您的问题。

它将容器缩放到图像的大小，但另一方面，由于比例原因，图像看起来不太好。

<figure class="image is-128x128 is-square">
  <img src="https://bulma.io/images/placeholders/128x128.png">
</figure>