相关疑难解决方法(0)

material-ui-next:设置图像大小以适合容器

我已经开始使用 Material-ui-next 并且在显示他们使用整个容器大小的图像时遇到了一些问题。例如我使用:

const styles = theme => ({
  Card: {
    width: 300,
    margin: 'auto'
  },
  Media: {
    height: 550
  }
});
Run Code Online (Sandbox Code Playgroud)

在渲染中:

<Card className={classes.Card}>
   <CardMedia
        className={classes.Media}
        image={ImgPomodoR}
        title="a pomodoro tomatoe timer in material design"
   />
   <CardContent>
      <Typography gutterBottom variant="headline" component="h2">
        ...
Run Code Online (Sandbox Code Playgroud)

文档说我必须指定图像的高度才能显示。“媒体”示例使图像的高度为 0,但是,如果我应用我的图像未显示 -提到的示例

现在,对我来说,这是媒体高度的反复试验,它适合 Card 容器而不会被裁剪。有没有“自动”的方式来做到这一点?

任何帮助都受到高度赞赏,欢呼伙伴们,

托比亚斯

编辑:我应该提到height: "100%"//maxHeight: "100%"对我也不起作用。

css image-size reactjs material-ui

4
推荐指数
1
解决办法
2万
查看次数

标签 统计

css ×1

image-size ×1

material-ui ×1

reactjs ×1