Skip to main content
Skip table of contents

ListItemText

Overview

ListItemText is a single item that contains the individual content, and it will allow placing text in the ListItem with its properties.

Please refer to this for more information: https://mui.com/material-ui/api/list-item-text/.

Import

CODE
import { ListItem, ListItemButton, ListItemText } from '@mui/material';

The above source will be imported automatically after dragging and dropping the Basic Component to the UI Preview Panel.

Property

Property:

Name

Default

Description

Id-name

Placeholder: <id-name>

The Id-name of the created component.

State

State: Normal

The State of the created Component.

Margin and Padding

Size Unit: Px

The component Margin and Padding with many selectable Size Units.

Size

Size Unit: Px

The component Size includes Width and Height with many selectable Size Units.

Layout

Position: None

Size Unit: Px

The component Layout includes Position and Top - Right - Bottom - Left with many selectable Size Units.

General

Inset: False

Opacity: 100%

The component General includes Inset, Opacity, and Background.

Advanced Style

The component Advanced Style includes Classname and Inline Style addition.

Code Sample:

CODE
<ListItemText
                    sx={{':hover': {'width': '150px','height': '300px',
                        'position': 'fixed',
                        'margin': '10px 30px 20px 20px', 'padding': '10px 30px 20px 20px',
                        'top': '20px','right': '20px','bottom': '20px','left': '20px',
                        'opacity': 0.33,'backgroundColor': '#ff0000ff',}, }} 
                        inset={true}>
  </ListItemText>

Related Component

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.