---
title: Qual é a propriedade CSS `display` e você pode dar alguns exemplos de seu uso?
---

Os valores comuns para a propriedade `display`: `none`, `block`, `inline`, `inline-block`, `flex`, `grid`, `tabela`, `table-row`, `table-cell`, `table-cell`, `list-item`.

| Valor `display` | Descrição |
| :-- | :-- |
| `none` | Não exibe um elemento (o elemento não afeta mais o layout do documento). Todos os elementos filhos também não são mais exibidos. O documento é renderizado como se o elemento não existisse na árvore do documento. |
| `block` | O elemento consome toda a linha na direção do bloco (que geralmente é horizontal). |
| `inline` | Elementos podem ser dispostos lado a lado. |
| `inline-block` | Semelhante ao `inline`, mas permite algumas propriedades `block` como configuração de `width` e `height`. |
| `flex` | Comporta-se como um contêiner `flex` de nível de bloco, que pode ser manipulado usando o modelo de flexbox. |
| `grid` | Comporta-se como um contêiner `grid` de nível de bloco usando o layout de grade. |
| `table` | Comporta-se como o elemento `<table>`. |
| `table-row` | Comporta-se como o elemento `<tr>`. |
| `table-cell` | Comporta-se como o elemento `<td>`. |
| `list-item` | Comporta-se como um elemento `<li>` que lhe permite definir `list-style-type` e `list-style-position`. |

Para uma lista completa de valores para a propriedade `display`, consulte [CSS Display | MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/display).

## Referências

- [CSS Display | MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/display)