DICIONÁRIO DE TERMOS NO CSS (em construção)
- #CSS
Introdução
Esse material foi elaborado visando ser uma fonte de consulta que poderá esclarecer alguma dúvida sobre termos usados no CSS.
Inicialmente esse material conta com a explicação de algumas propriedades utilizadas, mas o objetivo é incluir outras categorias em outros momentos.
Fique a vontade para contribuir, deixe nos comentários termos que podem ser adicionados, além é claro da sua opinião sobre esse material.
Sumário
# A B C D E F H J L M O P R T U V W Z
PROPRIEDADES
#
- @keyframes - Especifica o código de animação.
A
- align-content - Modifica o comportamento da propriedade flex-wrap. É semelhante a align-items, mas em vez de alinhar itens flexíveis, alinha linhas flexíveis.
- align-items - Alinha verticalmente os itens flexíveis quando os itens não usam todo o espaço disponível no eixo cruzado.
- align-self - Especifica o alinhamento de um item flexível (substitui a propriedade align-items do contêiner flexível).
- animation - Uma propriedade abreviada para definir todas as propriedades de animação.
- animation-delay - Especifica um atraso para o início de uma animação.
- animation-direction - Especifica se uma animação deve ser reproduzida para frente, para trás ou em ciclos alternados.
- animation-duration - Especifica quanto tempo uma animação deve levar para completar um ciclo.
- animation-fill-mode - Especifica um estilo para o elemento quando a animação não está sendo reproduzida (antes de começar, depois de terminar ou ambos).
- animation-iteration-count - Especifica o número de vezes que uma animação deve ser reproduzida.
- animation-name - Especifica o nome da animação @keyframes.
- animation-play-state - Especifica se a animação está em execução ou pausada.
- animation-timing-function - Específica a curva de velocidade da animação.
B
- backface-visibility - Define se um elemento deve ou não estar visível quando não está voltado para a tela.
- background - Define todas as propriedades do plano de fundo em uma declaração.
- background-attachment - Define se uma imagem de fundo é fixa ou rola com o resto da página.
- background-clip - Especifica a área de pintura do plano de fundo.
- background-color - Define a cor de fundo de um elemento.
- background-image - Define a imagem de fundo para um elemento.
- background-origin - Específica onde a(s) imagem(ns) de fundo está(ão) posicionada(s).
- background-position - Define a posição inicial de uma imagem de fundo.
- background-repeat - Define como uma imagem de fundo será repetida.
- background-size - Especifica o tamanho das imagens de fundo.
- border - Define todas as propriedades da borda em uma declaração.
- border-bottom - Define todas as propriedades da borda inferior em uma declaração.
- border-bottom-color - Define a cor da borda inferior.
- border-bottom-left-radius - Define a forma da borda do canto inferior esquerdo.
- border-bottom-right-radius - Define a forma da borda do canto inferior direito.
- border-bottom-style - Define o estilo da borda inferior.
- border-bottom-width - Define a largura da borda inferior.
- border-collapse - Especifica se as bordas da tabela devem ou não ser recolhidas.
- border-color - Define a cor das quatro bordas.
- border-image - Uma propriedade abreviada para definir todas as propriedades border-image-*.
- border-image-outset - Especifica a quantidade pela qual a área da imagem da borda se estende além da caixa da borda.
- border-image-repeat - Specifies whether the border image should be repeated, rounded or stretched.
- border-image-slice - Específica como cortar a imagem da borda.
- border-image-source - Especifica o caminho para a imagem a ser usada como borda.
- border-image-width - Especifica as larguras da imagem da borda.
- border-left - Define todas as propriedades da borda esquerda em uma declaração.
- border-left-color - Define a cor da borda esquerda.
- border-left-style - Define o estilo da borda esquerda.
- border-left-width - Define a largura da borda esquerda.
- border-radius - Define todas as quatro propriedades border-*-radius para cantos arredondados.
- border-right - Define todas as propriedades da borda direita em uma declaração.
- border-right-color - Define a cor da borda direita.
- border-right-style - Define o estilo da borda direita.
- border-right-width - Define a largura da borda direita.
- border-spacing - Especifica a distância entre as bordas das células adjacentes.
- border-style - Define o estilo das quatro bordas.
- border-top - Define todas as propriedades da borda superior em uma declaração.
- border-top-color - Define a cor da borda superior.
- border-top-left-radius - Define a forma da borda do canto superior esquerdo.
- border-top-right-radius - Define a forma da borda do canto superior direito.
- border-top-style - Define o estilo da borda superior.
- border-top-width - Define a largura da borda superior.
- border-width - Define a largura das quatro bordas.
- bottom - Define a borda da margem inferior para uma caixa posicionada.
- box-shadow - Adiciona uma ou mais sombras a um elemento.
- box-sizing - Define como a largura e a altura de um elemento são calculadas: devem incluir preenchimento e bordas ou não.
C
- caption-side - Especifica o posicionamento de uma legenda de tabela.
- clear - Específica o que deve acontecer com o elemento que está próximo a um elemento flutuante.
- clip - Recorta um elemento posicionado absolutamente.
- color - Especifica a cor do texto.
- column-count - Especifica o número de colunas em que um elemento deve ser dividido.
- column-fill - Específica como preencher as colunas.
- column-gap - Especifica o intervalo entre as colunas.
- column-rule - Uma propriedade abreviada para definir todas as propriedades column-rule-*.
- column-rule-color - Especifica a cor da regra entre as colunas.
- column-rule-style - Especifica o estilo da regra entre as colunas.
- column-rule-width - Especifica a largura da regra entre as colunas.
- column-span - Especifica quantas colunas um elemento deve abranger.
- column-width - Especifica uma largura ideal sugerida para as colunas.
- columns - Uma propriedade abreviada para definir a largura da coluna e a contagem de colunas.
D
- direction - Especifica a direção do texto/direção da escrita.
- display - Específica como um elemento deve ser exibido.
- display - Especifica o tipo de caixa usado para um elemento HTML.
E
- empty-cells - Especifica se as bordas e o plano de fundo devem ou não ser exibidos em células vazias em uma tabela.
F
- flex - Uma propriedade abreviada para as propriedades flex-grow, flex-shrink e flex-basis.
- flex-basis - Especifica o comprimento inicial de um item flexível.
- flex-direction - Especifica a direção dos itens flexíveis dentro de um contêiner flexível.
- flex-flow - Uma propriedade abreviada para flex-direction e flex-wrap.
- flex-grow - Específica quanto um item flexível crescerá em relação ao restante dos itens flexíveis dentro do mesmo contêiner.
- flex-shrink - Especifica o quanto um item flexível diminuirá em relação ao restante dos itens flexíveis dentro do mesmo contêiner
- flex-wrap - Especifica se os itens flexíveis devem ser agrupados ou não, se não houver espaço suficiente para eles em uma linha flexível.
- float - Especifica se um elemento deve flutuar para a esquerda, direita ou nada.
- font - Define todas as propriedades da fonte em uma declaração.
- font-family - Especifica a família de fontes para texto.
- font-size - Especifica o tamanho da fonte do texto.
- font-style - Especifica o estilo da fonte para o texto.
- font-variant - Especifica se um texto deve ou não ser exibido em uma fonte de versalete.
- font-weight - Especifica o peso de uma fonte.
H
- height - Define a altura de um elemento.
J
- justify-content - Alinha horizontalmente os itens flexíveis quando os itens não usam todo o espaço disponível no eixo principal.
L
- left - Define a borda da margem esquerda para uma caixa posicionada.
- letter-spacing - Especifica o espaço entre os caracteres em um texto.
- line-height - Especifica a altura da linha.
- list-style - Define todas as propriedades de uma lista em uma declaração.
- list-style-image - Especifica uma imagem como marcador de item de lista.
- list-style-position - Especifica a posição dos marcadores de item de lista (pontos de bala).
- list-style-type - Especifica o tipo de marcador de item de lista.
M
- margin - Uma propriedade abreviada para definir todas as propriedades de margem em uma declaração.
- margin-bottom - Define a margem inferior de um elemento.
- margin-left - Define a margem esquerda de um elemento.
- margin-right - Define a margem direita de um elemento.
- margin-top - Define a margem superior de um elemento.
- mask-image - Especifica uma imagem a ser usada como uma camada de máscara para um elemento.
- mask-mode - Especifica-se a imagem da camada de máscara é tratada como uma máscara de luminância ou como uma máscara alfa.
- mask-origin - Especifica a posição de origem (a área de posição da máscara) de uma imagem de camada de máscara.
- mask-position - Define a posição inicial de uma imagem de camada de máscara (em relação à área de posição da máscara).
- mask-repeat - Específica como a imagem da camada de máscara é repetida.
- mask-size - Especifica o tamanho de uma imagem de camada de máscara.
- max-height - Define a altura máxima de um elemento.
- max-width - Define a largura máxima de um elemento.
- min-height - Define a altura mínima de um elemento.
- min-width - Define a largura mínima de um elemento.
O
- object-fit - Especifica como um <img> ou <video> deve ser redimensionado para caber em seu contêiner.
- object-position - Especifica como um <img> ou <video> deve ser posicionado com coordenadas x/y dentro de sua "própria caixa de conteúdo".
- order - Especifica a ordem dos itens flexíveis dentro do mesmo contêiner.
- outline - Uma propriedade abreviada para definir a largura do contorno, o estilo do contorno e a cor do contorno em uma declaração.
- outline-color - Define a cor de um contorno.
- outline-offset - Especifica o espaço entre um contorno e a borda ou borda de um elemento.
- outline-style - Sets the style of an outline.
- outline-width - Define a largura de um contorno.
- overflow - Específica o que acontece se o conteúdo ultrapassar a caixa de um elemento.
- overflow-wrap - Especifica se o navegador pode ou não quebrar linhas com palavras longas, se elas ultrapassarem seu contêiner.
- overflow-x - Especifica o que fazer com as bordas esquerda/direita do conteúdo se ultrapassar a área de conteúdo do elemento.
- overflow-y - Especifica o que fazer com as bordas superior/inferior do conteúdo se ultrapassar a área de conteúdo do elemento.
P
- padding - Uma propriedade abreviada para definir todas as propriedades de preenchimento em uma declaração.
- padding-bottom - Define o preenchimento inferior de um elemento.
- padding-left - Define o preenchimento esquerdo de um elemento.
- padding-right - Define o preenchimento direito de um elemento.
- padding-top - Define o preenchimento superior de um elemento.
- perspective - Específica a perspectiva de como os elementos 3D são visualizados.
- perspective-origin - Especifica a posição inferior dos elementos 3D.
- position - Especifica o tipo de posicionamento de um elemento.
R
- resize - Especifica se um elemento é ou não redimensionável pelo usuário.
- right - Define a borda da margem direita para uma caixa posicionada.
T
- table-layout - Define o algoritmo de layout a ser usado para uma tabela.
- text-align - Especifica o alinhamento horizontal do texto.
- text-align-last - Específica como alinhar a última linha de um texto.
- text-decoration - Define todas as propriedades de decoração de texto em uma declaração.
- text-decoration-color - Especifica a cor da decoração de texto.
- text-decoration-line - Especifica o tipo de decoração de texto a ser usado (sublinhado, sobrelinhado, etc.)
- text-decoration-style - Especifica o estilo da decoração do texto (sólido, pontilhado, etc.)
- text-decoration-thickness - Especifica a espessura da linha de decoração de texto.
- text-indent - Especifica o recuo da primeira linha em um bloco de texto.
- text-justify - Específica como o texto justificado deve ser alinhado e espaçado.
- text-overflow - Específica como o conteúdo transbordado que não é exibido deve ser sinalizado ao usuário.
- text-shadow - Específica o efeito de sombra adicionado ao texto.
- text-transform - Controla a capitalização do texto (letras maiúsculas e minúsculas).
- top - Define a borda da margem superior para uma caixa posicionada.
- transform - Aplica uma transformação 2D ou 3D a um elemento.
- transform-origin - Permite alterar a posição em elementos transformados.
- transform-style - Especifica como os elementos aninhados são renderizados no espaço 3D.
- transition - Uma propriedade abreviada para definir as quatro propriedades de transição em uma única propriedade.
- transition-delay - Especifica um atraso (em segundos) para o efeito de transição.
- transition-duration - Especifica quantos segundos ou milissegundos um efeito de transição leva para ser concluído.
- transition-property - Especifica o nome da propriedade CSS para a qual se destina o efeito de transição.
- transition-timing-function - Específica a curva de velocidade do efeito de transição.
U
- unicode-bidi - Usado junto com a propriedade direction para definir ou retornar se o texto deve ser substituído para oferecer suporte a vários idiomas no mesmo documento.
V
- vertical-align - Define o alinhamento vertical de um elemento.
- visibility - Especifica se um elemento deve ou não ser visível.
W
- white-space - Específica como lidar com espaços em branco dentro de um elemento.
- width - Define a largura de um elemento.
- word-break - Especifica regras de quebra de linha para scripts não CJK.
- word-spacing - Especifica o espaço entre as palavras em um texto.
- word-wrap - Permite que palavras longas possam ser quebradas e passar para a próxima linha.
- writing-mode - Especifica se as linhas de texto são dispostas horizontalmente ou verticalmente.
Z
- z-index - Define a ordem de pilha de um elemento.
Importante
Esse material está sendo elaborado à medida que vou aprofundando nos meus estudos no desenvolvimento fullstack.
Caso tenha alguma observação a ser feita ou queira a informar algum conteúdo a ser incluído deixe nos comentários.