ImageListItem API
API documentation for the React ImageListItem component. Learn about the available props and the CSS API.
Import
import ImageListItem from '@mui/material/ImageListItem';
// or
import { ImageListItem } from '@mui/material';
Component name
The nameMuiImageListItem
can be used when providing default props or style overrides in the theme.Props
Props of the native component are also available.
Name | Type | Default | Description |
---|---|---|---|
children | node | The content of the component, normally an <img> . | |
classes | object | Override or extend the styles applied to the component. See CSS API below for more details. | |
cols | integer | 1 | Width of the item in number of grid columns. |
component | elementType | The component used for the root node. Either a string to use a HTML element or a component. | |
rows | integer | 1 | Height of the item in number of grid rows. |
sx | object | The system prop that allows defining system overrides as well as additional CSS styles. See the `sx` page for more details. |
The
ref
is forwarded to the root element.CSS
Rule name | Global class | Description |
---|---|---|
root | .MuiImageListItem-root | Styles applied to the root element. |
img | .MuiImageListItem-img | Styles applied to an `img` element to ensure it covers the item. |
standard | .MuiImageListItem-standard | Styles applied to the root element if variant="standard" . |
woven | .MuiImageListItem-woven | Styles applied to the root element if variant="woven" . |
masonry | .MuiImageListItem-masonry | Styles applied to the root element if variant="masonry" . |
quilted | .MuiImageListItem-quilted | Styles applied to the root element if variant="quilted" . |
You can override the style of the component using one of these customization options:
- With a global class name.
- With a rule name as part of the component's
styleOverrides
property in a custom theme.