FormLabel

Overview

FormLabel is often used as part of a subcomponent in a form. FormLabel can only be constructed after FormControl has been defined, just like the wayFormControlLabel operates.

Only after FormControl has been defined on the Source code can FormLabel be generated and included in FormControl as the below code sample.

Please refer to this for more information: https://mui.com/material-ui/api/form-label/.

Import

CODE

import { FormControl, FormLabel } from '@mui/material';

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

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.
Text	Text: New Form Label Font-family: None Size Unit: Px Font-weight: None Text-align: Left	The component Text includes Text, Font-family, Font-size, Font-weight, Size Unit, Font-color, Text-align.
General	Opacity: 100%	The component General includes Opacity, and Background.
Advanced Style		The component Advanced Style includes Classname and Inline Style addition.

Code Sample

CODE

 <FormControl>
      <FormLabel
            sx={{
              'margin': '10px 30px 40px 20px',
              'padding': '10px 30px 40px 20px',
              ':active': {
                'width': '150px',
                'height': '100px',
                'fontFamily': 'Noto-Sans',
                'fontSize': '15px',
                'fontWeight': 'bold',
              },
            }}
          >Form1
      </FormLabel>
        </FormControl>

Related Component:

FormControl