Paper API
Documentação da API para o componente React Paper . Aprenda sobre as propriedades disponíveis e a API CSS.
Importação
import Paper from '@mui/material/Paper';
// ou
import { Paper } from '@mui/material';
Nome do componente
The nameMuiPaper
can be used when providing default props or style overrides in the theme.Propriedades
Props of the nativo component are also available.
Nome | Tipo | Padrão | Descrição |
---|---|---|---|
children | node | O conteúdo do componente. | |
classes | object | Sobrescreve ou extende os estilos aplicados para o componente. Veja a API CSS abaixo para maiores detalhes. | |
component | elementType | The component used for the root node. Either a string to use a HTML element or a component. | |
elevation | integer | 1 | Shadow depth, corresponds to dp in the spec. It accepts values between 0 and 24 inclusive. |
square | bool | false | Se true , cantos arredondados são desabilitados. |
sx | func | object | The system prop that allows defining system overrides as well as additional CSS styles. See the `sx` page for more details. | |
variant | 'elevation' | 'outlined' | string | 'elevation' | A variante a usar. |
O
ref
é encaminhado para o elemento raiz.CSS
Nome da regra | Classe global | Descrição |
---|---|---|
root | .MuiPaper-root | Estilos aplicados ao elemento raiz. |
rounded | .MuiPaper-rounded | Estilos aplicados em o elemento raiz a menos que square={true} . |
outlined | .MuiPaper-outlined | Estilos aplicados para o elemento raiz se variant="outlined" . |
elevation | .MuiPaper-elevation | Estilos aplicados para o elemento raiz se variant="elevation" . |
elevation0 | .MuiPaper-elevation0 | |
elevation1 | .MuiPaper-elevation1 | |
elevation2 | .MuiPaper-elevation2 | |
elevation3 | .MuiPaper-elevation3 | |
elevation4 | .MuiPaper-elevation4 | |
elevation5 | .MuiPaper-elevation5 | |
elevation6 | .MuiPaper-elevation6 | |
elevation7 | .MuiPaper-elevation7 | |
elevation8 | .MuiPaper-elevation8 | |
elevation9 | .MuiPaper-elevation9 | |
elevation10 | .MuiPaper-elevation10 | |
elevation11 | .MuiPaper-elevation11 | |
elevation12 | .MuiPaper-elevation12 | |
elevation13 | .MuiPaper-elevation13 | |
elevation14 | .MuiPaper-elevation14 | |
elevation15 | .MuiPaper-elevation15 | |
elevation16 | .MuiPaper-elevation16 | |
elevation17 | .MuiPaper-elevation17 | |
elevation18 | .MuiPaper-elevation18 | |
elevation19 | .MuiPaper-elevation19 | |
elevation20 | .MuiPaper-elevation20 | |
elevation21 | .MuiPaper-elevation21 | |
elevation22 | .MuiPaper-elevation22 | |
elevation23 | .MuiPaper-elevation23 | |
elevation24 | .MuiPaper-elevation24 |
Você pode sobrescrever o estilo do componente usando uma dessas opções de customização:
- With a global class name.
- With a rule name as part of the component's
styleOverrides
property in a custom theme.