CSS display * Tipo de display

CSS display

Hereditary: Nein

display (bloco | inline | run-in
flow | fluxo-raiz | tabela | flex | grid | ruby | subgrade
list-item | list-item bloco | list-item de fluxo | list-item de fluxo de raiz | list-item bloquear o fluxo de | list-item bloquear o fluxo de raiz | fluxo de lista de item de bloco
tabela-linha de grupo | tabela de cabeçalho de grupo | tabela-de rodapé de grupo | tabela-linha | table-cell | tabela-coluna-grupo | tabela-coluna | tabela-legenda | ruby-base | ruby-texto | ruby-base-recipiente | ruby-texto-recipiente
content | none
inline-block | inline-list-item | inline-table | inline-flex | inline-grid
bloco de stellt ein Elemento als Blockelement oder – caixa, que cria uma quebra de linha antes e depois do elemento. flex representa um elemento como um elemento bloco e um recipiente flex. flow-root pode ser o fim do clearfix: depois de um bloco com display: flow-root, o próximo bloco deve ir para a aresta, mesmo que um elemento com float:esquerda ou float-direita esteja neste bloco. grid cria uma grade de layout na qual os elementos podem ser colocados em qualquer posição, independentemente da ordem do conteúdo (suportado por IE10, IE11 e Edge apenas em uma sintaxe antiga limitada). inline-flex representa um elemento como um elemento inline e Flex container. inline é o padrão e representa um elemento como um elemento inline. Elementos em linha não resultam em uma quebra de linha antes e depois do elemento. Em outras palavras, o elemento é exibido na mesma linha. inline-block cria uma caixa que” flui ” dentro de uma inlinebox. a tabela em linha representa uma tabela como um elemento em linha ou caixa que não resulta em uma quebra de linha antes e depois da tabela. list-item representa o item como uma lista. Cada elemento pode ser precedido por um item de lista opcional, como um círculo preenchido, que também pode ser substituído por uma imagem, um ícone ou símbolo.
Uma alternativa elegante para ::antes do marcador atribuir um marcador para o conteúdo antes ou depois de um elemento de caixa. o marcador é usado em conjunto com os pseudo-elementos :depois e :antes (Mostrar:marcador para truques CSS) nenhum suprime a visualização de elementos. Se a visualização: nenhuma se aplica, o navegador deve ignorar todas as instruções de posicionamento (tanto a posição como a flutuação) e não gera uma caixa para o elemento. run-in representa o elemento como um bloco ou elemento em linha, dependendo do contexto. a tabela representa um elemento como um elemento de bloco. a legenda da tabela representa um elemento como uma legenda da tabela. a célula da tabela representa o elemento como se fosse uma célula da tabela (td). a coluna da tabela representa o elemento como se fosse uma coluna da tabela (col). table-column-group representa o elemento como se fosse um grupo de colunas de tabela (colgroup). table-footer-group representa o elemento como se fosse um grupo de notas de tabela (table-footer). table-header-group representa o elemento como se fosse um grupo de cabeçalhos de tabela. a linha da tabela representa o elemento como se fosse uma linha da tabela (linha da tabela). table-row-group representa o elemento como se fosse um grupo de linhas de tabela (table row).