Manual de Referência CSS

Regras CSS (RULES)

大全 de Atributos CSS

Regra @ do CSS (At)-rules)CSS z-Atributo index

Manual Completo de Propriedades CSS (por função)

Atributos CSS pesquisados em ordem alfabética, esta parte inclui os mais recentes CSS3Completa lista de atributos padrão normativos. Todos os atributos são divididos em atributos de animação, atributos de fundo, atributos de borda, atributos de cor, tamanho e dimensão de altura e largura, box flexível, atributos de fonte, atributos de item de lista, atributos de margem, atributos de contorno, atributos de fonte de texto, atributos visuais, etc.

Atributo de Animação (Animation)

Atributo	Descrição
`animation`	Especificar animações baseadas em keyframes.
`animation-delay`	Especificar quando a animação deve começar.
`animation-direction`	Especificar se a animação deve ser reproduzida ao contrário em ciclos alternados.
`animation-duration`	Especificar o tempo que a animação deve demorar para completar um ciclo.
`animation-fill-mode`	Especificar como aplicar estilos ao alvo da animação CSS antes e após a execução.
`animation-iteration-count`	Especificar o número de vezes que a animação deve ser reproduzida antes de parar.
`animation-name`	especificar`@keyframes`Nome da animação aplicada ao elemento selecionado.
`animation-play-state`	Especificar se a animação deve ser executada ou pausada.
`animation-timing-function`	Especificar como a animação CSS deve ser executada em cada ciclo.

Atributo de Fundo (Background)

Atributo	Descrição
`background`	Definir vários atributos de fundo em uma declaração.
`background-attachment`	Especificar se a imagem de fundo deve ser fixa na visualização ou rolar.
`background-clip`	Especificar a área de desenho do fundo.
`background-color`	Definir a cor de fundo do elemento.
`background-image`	Definir a imagem de fundo do elemento.
`background-origin`	Especificar a área de localização da imagem de fundo.
`background-position`	Definir o ponto de origem da imagem de fundo.
`background-repeat`	Especificar se/Como repetir a imagem de fundo.
`background-size`	Especificar o tamanho da imagem de fundo.

Atributo da Borda (Border)

Atributo	Descrição
`border`	Definir a largura, estilo e cor de todos os quatro lados da borda do elemento.
`border-bottom`	Definir a largura, estilo e cor da borda inferior do elemento.
`border-bottom-color`	Definir a cor da borda inferior do elemento.
`border-bottom-left-radius`	Definir a forma do canto inferior esquerdo do elemento.
`border-bottom-right-radius`	Definir a forma do canto inferior direito do elemento.
`border-bottom-style`	Definir o estilo da borda inferior do elemento.
`border-bottom-width`	Definir a largura da borda inferior do elemento.
`border-color`	Definir a cor da borda de todos os quatro lados do elemento.
`border-image`	Especificar como usar a imagem para substituir o estilo da borda.
`border-image-outset`	Especificar a quantidade de área da imagem da borda que ultrapassa a borda.
`border-image-repeat`	Especificar se a imagem da borda deve ser repetida, arredondada ou esticada.
`border-image-slice`	Especificar o deslocamento interno da borda da imagem.
`border-image-source`	Especificar a posição da imagem a ser usada como borda.
`border-image-width`	Especificar a largura da borda da imagem.
`border-left`	Definir a largura, estilo e cor da borda esquerda do elemento.
`border-left-color`	Definir a cor da borda esquerda do elemento.
`border-left-style`	Definir o estilo da borda esquerda do elemento.
`border-left-width`	Definir a largura da borda esquerda do elemento.
`border-radius`	Definir a forma dos cantos do elemento.
`border-right`	Definir a largura, estilo e cor da borda direita do elemento.
`border-right-color`	Definir a cor da borda direita do elemento.
`border-right-style`	Definir o estilo da borda direita do elemento.
`border-right-width`	Definir a largura da borda direita do elemento.
`border-style`	Definir o estilo da borda em todos os quatro lados do elemento.
`border-top`	Definir a largura, estilo e cor da borda superior do elemento.
`border-top-color`	Definir a cor da borda superior do elemento.
`border-top-left-radius`	Definir a forma do canto superior esquerdo do elemento.
`border-top-right-radius`	Definir a forma do canto superior direito do elemento.
`border-top-style`	Definir o estilo da borda superior do elemento.
`border-top-width`	Definir a largura da borda superior do elemento.
`border-width`	Definir a largura da borda de todos os quatro lados do elemento.

Propriedade de cor (Color)

Atributo	Descrição
`color`	Definir a cor do texto do elemento.
`opacity`	Definir a opacidade do elemento.

Propriedade de tamanho (Size)

Atributo	Descrição
`height`	Definir a altura do elemento.
`max-height`	Definir a altura máxima do elemento.
`max-width`	Definir a largura máxima do elemento.
`min-height`	Definir a altura mínima do elemento.
`min-width`	Definir a largura mínima do elemento.
`width`	Definir a largura do elemento.

Propriedade de conteúdo (Content)

Atributo	Descrição
`content`	Inserir conteúdo gerado.
`quotes`	Definir o tipo de aspas das aspas incorporadas.
`counter-reset`	Criar ou redefinir um ou mais contadores.
`counter-increment`	Incrementar um ou mais valores de contadores.

Layout de Flex Box elástico (Flex)

Atributo	Descrição
`align-content`	Definir o alinhamento dos itens do contêiner elástico no contêiner elástico.
`align-items`	Definir o alinhamento padrão para os itens no contêiner flexível.
`align-self`	Definir o alinhamento do item selecionado no contêiner elástico.
`flex`	Definir a componente de comprimento elástico.
`flex-basis`	Definir o tamanho inicial principal do item elástico.
`flex-direction`	Definir a direção do item elástico.
`flex-flow`	`flex-direction`e`flex-wrap`propriedade abreviada do atributo.
`flex-grow`	Definir como o item elástico se expande em relação aos outros itens no contêiner elástico.
`flex-shrink`	Definir como o item flexível se contrai em relação aos outros itens no contêiner flexível.
`flex-wrap`	Definir se deve empacotar itens flexíveis.
`justify-content`	Definir como o item elástico alinhado ao eixo principal do contêiner elástico após resolver qualquer comprimento elástico e margem automática.
`order`	Definir a ordem de exibição e layout do item elástico no contêiner elástico.

Propriedade de fonte (Fonts)

Atributo	Descrição
`font`	Definir várias propriedades de fonte em uma declaração.
`font-family`	Definir a lista de fontes do elemento.
`font-size`	Definir o tamanho da fonte do texto.
`font-size-adjust`	Manter a legibilidade do texto quando ocorrer o fallback da fonte.
`font-stretch`	Escolher uma fonte normal, comprimida ou expandida da fonte.
`font-style`	Definir o estilo da fonte do texto.
`font-variant`	Definir a variante da fonte.
`font-weight`	Definir a espessura da fonte do texto.

Propriedade de itens da lista (Lists)

Atributo	Descrição
`list-style`	Definir o estilo de exibição da lista e dos elementos da lista.
`list-style-image`	Definir a imagem usada como marcação do item da lista.
`list-style-position`	Definir a posição da marcação do item da lista.
`list-style-type`	Definir o estilo de marcação dos itens da lista.

Propriedade de margem (Margin)

Atributo	Descrição
`margin`	Definir margens em todos os quatro lados do elemento.
`margin-bottom`	Definir o margem inferior do elemento.
`margin-left`	Definir o margem esquerda do elemento.
`margin-right`	Definir o margem direito do elemento.
`margin-top`	Definir o margem superior do elemento.

Propriedade de layout de colunas múltiplas (Column)

Atributo	Descrição
`column-count`	Definir o número de colunas nos elementos múltiplos.
`column-fill`	Definir como preencher as colunas.
`column-gap`	Definir o espaçamento entre as colunas de elementos múltiplos.
`column-rule`	Definir a linha ou "regra" desenhada entre cada coluna de elementos múltiplos.
`column-rule-color`	especificar a cor da regra desenhada entre as colunas no layout de múltiplas colunas.
`column-rule-style`	especificar o estilo da regra desenhada entre as colunas no layout de múltiplas colunas.
`column-rule-width`	especificar a largura regular desenhada entre as colunas no layout de múltiplas colunas.
`column-span`	especificar quantas colunas o elemento cruzará no layout de múltiplas colunas.
`column-width`	especificar o melhor largura da coluna em elementos de múltiplas colunas.
`columns`	usado para definir`column-width`e`column-count`propriedade abreviada do atributo.

propriedades de contorno(Outline)

Atributo	Descrição
`outline`	definir a largura, estilo e cor de todos os quatro lados do contorno do elemento.
`outline-color`	definir a cor do contorno.
`outline-offset`	definir o espaço entre o contorno e a borda do elemento.
`outline-style`	definir o estilo do contorno.
`outline-width`	definir a largura do contorno.

propriedades de preenchimento(Padding)

Atributo	Descrição
`padding`	definir o preenchimento em todas as quatro faces do elemento.
`padding-bottom`	definir o preenchimento na parte inferior do elemento.
`padding-left`	definir o preenchimento no lado esquerdo do elemento.
`padding-right`	definir o preenchimento no lado direito do elemento.
`padding-top`	definir o preenchimento no topo do elemento.

propriedades de impressão(Print)

Atributo	Descrição
`page-break-after`	inserir um símbolo de quebra de página após o elemento.
`page-break-before`	inserir um símbolo de quebra de página antes do elemento.
`page-break-inside`	inserir um símbolo de quebra de página dentro do elemento.

propriedades da tabela(Table)

Atributo	Descrição
`border-collapse`	especificar se as bordas das células da tabela serão conectadas ou separadas.
`border-spacing`	definir o espaçamento entre as bordas das células de tabela adjacentes.
`caption-side`	especificar a posição do título da tabela.
`empty-cells`	exibir ou ocultar as bordas e a cor de fundo das células de tabela vazias.
`table-layout`	especificar o algoritmo de layout da tabela.

propriedades de texto(Text)

Atributo	Descrição
`direction`	definir a direção do texto./direção de escrita.
`tab-size`	especificar o comprimento do tabulador.
`text-align`	definir o alinhamento horizontal do conteúdo inline.
`text-align-last`	especificar quando`text-align`como alinhar a última linha do bloco ou a linha antes do carretinho de nova linha quando a propriedade estiver definida`justify`.
`text-decoration`	especificar a decoração a ser adicionada ao texto.
`text-decoration-color`	cor especificada`text-decoration-line`.
`text-decoration-line`	especificar qual tipo de decoração de linha será adicionada ao elemento.
`text-decoration-style`	especificar`text-decoration-line`estilo de linha especificado pela propriedade
`text-indent`	indentar a primeira linha do texto.
`text-justify`	especificar quando`text-align`método de alinhamento usado quando a propriedade estiver definida`justify`.
`text-overflow`	especificar como o conteúdo textual será exibido quando exceder o contêiner do bloco.
`text-shadow`	aplicar uma ou mais sombras ao conteúdo textual do elemento.
`text-transform`	converter o texto entre maiúsculas e minúsculas.
`line-height`	definir a altura entre as linhas de texto.
`vertical-align`	definir a posição vertical do elemento em relação à linha de base do texto atual.
`letter-spacing`	definir espaço adicional entre as letras.
`word-spacing`	Definir o espaçamento entre palavras.
`white-space`	Especificar como tratar espaços dentro de um elemento.
`word-break`	Especificar como quebrar palavras dentro de uma palavra.
`word-wrap`	Especificar se as palavras devem ser quebradas quando o conteúdo ultrapassa os limites do contêiner.

Atributo de transformação (Transform)

Atributo	Descrição
`backface-visibility`	Especificar se o lado de trás do elemento transformado é visível quando virado para o usuário.
`perspective`	Definir a perspetiva de todos os elementos filhos vistos a partir do objeto.
`perspective-origin`	Definir o ponto de origem das propriedades de perspetiva (3o ponto de fuga do espaço D).
`transform`	Aplicar2D ou3A transformação D é aplicada ao elemento.
`transform-origin`	Definir o ponto de origem da transformação do elemento.
`transform-style`	Especificar como3Renderizar elementos aninhados no espaço D.

Atributo de transição (Transition)

Atributo	Descrição
`transition`	Definir a transição entre dois estados do elemento.
`transition-delay`	Especificar quando o efeito de transição deve começar.
`transition-duration`	Especificar o número de segundos ou milissegundos que o efeito de transição deve durar.
`transition-property`	Especificar o nome do atributo CSS ao qual o efeito de transição deve ser aplicado.
`transition-timing-function`	Especificar a curva de velocidade do efeito de transição.

Atributo de formatação visual

Atributo	Descrição
`display`	Especificar como o elemento é exibido na tela.
`position`	Especificar como posicionar o elemento.
`top`	Especificar a posição do margem superior do elemento posicionado.
`right`	Especificar a posição do margem direito do elemento posicionado.
`bottom`	Especificar a posição do margem inferior do elemento posicionado.
`left`	Especificar a posição do margem esquerda do elemento de posicionamento.
`float`	Especificar se uma caixa deve flutuar.
`clear`	Especificar a posição do elemento em relação ao elemento flutuante.
`z-index`	Especificar a ordem de camada ou empilhamento do elemento de posicionamento.
`overflow`	Especificar o tratamento do conteúdo da caixa de excedente.
`overflow-x`	Especificar como gerenciar o conteúdo quando ele ultrapassa a largura da área de conteúdo do elemento.
`overflow-y`	Especificar como gerenciar o conteúdo quando ele ultrapassa a altura da área de conteúdo do elemento.
`resize`	Especificar se o elemento pode ser ajustado pelo usuário.
`clip`	Definir a área de recorte.
`visibility`	Especificar se um elemento é visível.
`cursor`	Especificar o tipo do cursor.
`box-shadow`	Aplicar uma ou mais sombras à caixa do elemento.
`box-sizing`	Alterar o modelo de caixa padrão do CSS.

Regra @ do CSS (At)-rules)CSS z-Atributo index