Presenting media

Cards have built-in capabilities for displaying media. This includes things such as images and videos that become the focal point of the card.

How to do it...

Let's say that you have an image of the subject that the Card component is displaying. You can use the CardMedia component to render the image. You should use this component instead of something like <img> because it will handle a number of styling issues for you. Here's the code:

import React from 'react';

import { withStyles } from '@material-ui/core/styles';
import Card from '@material-ui/core/Card';
import CardHeader from '@material-ui/core/CardHeader';
import CardContent from '@material-ui...