Reactstrap Media 对象如何更改图像大小

Question

我正在使用 Reactstrap Media 对象将图像添加到网站中，但无法更改图像大小。请问如何更改媒体对象中的图像大小？

<Media object src={themes.image} alt={themes.name} />

Answer 1

您可以更改图片大小，如下所示。

const imgStyle = {
  maxHeight: 128,
  maxWidth: 128
}

<Media object src={themes.image} style={imgStyle} alt={themes.name} />

注意：默认情况下，如果我们没有明确指定，React 会将 px 添加到数字中。这里128就是128px

Answer 2

媒体道具列表有 className，因此您可以在 css 文件中提供 class，例如，

.my_image{
 height:100px;
 width:100px;
}

并将媒体用作，

<Media object src={themes.image} alt={themes.name} className='my_image' />

Reactstrap Media object how to change the image size