我有以下代码来制作卡片:
const styles = {
card: {
maxWidth: 345,
},
media: {
height: 140,
},
};
function MediaCard(props) {
const { classes } = props;
return (
<Card className={classes.card}>
<CardActionArea>
<CardMedia
className={classes.media}
image="/static/images/cards/contemplative-reptile.jpg"
title="Contemplative Reptile"
/>
<CardContent>
<Typography gutterBottom variant="h5" component="h2">
Lizard
</Typography>
<Typography component="p">
Lizards are a widespread group of squamate reptiles, with over 6,000 species, ranging
across all continents except Antarctica
</Typography>
</CardContent>
</CardActionArea>
<CardActions>
<Button size="small" color="primary">
Share
</Button>
<Button size="small" color="primary">
Learn More
</Button>
</CardActions>
</Card>
);
}
在图像内部,我想在图像的右上角添加一个按钮。我试图扩展CardMedia标记并插入一个按钮并对其进行绝对定位,但是我无法使其正确显示。