Propriedades CSS3

Encontre uma lista de todas as propriedades que pertencem à especificação CSS3, organizadas por grupos. Consulte as referências e descrições breves.

Nesta página, pode encontrar todos os grupos de propriedades CSS3 com referências e descrições breves.

Lista de propriedades CSS3

Propriedades de animação

Propriedade	Descrição
animation	Anima (altera gradualmente de um estilo para outro) propriedades CSS com valores discretos.
animation-delay	Especifica quando uma animação irá começar.
animation-direction	Define como a animação deve ser reproduzida: para a frente, para trás ou em ciclos alternados.
animation-duration	Define a duração (em segundos ou milissegundos) que uma animação demora a completar um ciclo.
animation-fill-mode	Define um estilo para o elemento quando a animação não está a ser executada (antes de começar, depois de terminar ou ambos).
animation-iteration-count	Define quantas vezes a animação deve ser reproduzida.
animation-name	Define o nome da regra @keyframes que pretende aplicar. Tem dois valores: none e keyframename.
animation-play-state	Especifica se a animação está em execução ou em pausa.
animation-timing-function	Define como a animação irá progredir ao longo da duração de cada ciclo, e não ao longo de toda a animação.
@keyframes (at-rule)	A at-rule @keyframes é a base das animações por keyframes utilizadas para animar (alterar gradualmente de um estilo para outro) muitas propriedades CSS.

Propriedades de fundo

Propriedade	Descrição
background-clip	Especifica a que distância do elemento devem ficar a background-color e a background-image.
background-origin	Especifica a área de posicionamento do fundo de uma background-image.
background-size	Define o tamanho da imagem de fundo.

Propriedades de borda

Propriedade	Descrição
border-bottom-left-radius	Define a forma arredondada do canto inferior esquerdo do elemento.
border-bottom-right-radius	Define o arredondamento do canto inferior direito do elemento.
border-image	Permite especificar uma imagem como borda à volta de um elemento.
border-image-outset	Especifica em que medida a imagem de borda se estende para além da caixa de borda do elemento.
border-image-repeat	Especifica se a border-image será arredondada, repetida ou esticada.
border-image-slice	Especifica como dividir a imagem indicada por border-image-source em nove regiões: quatro cantos, quatro arestas e uma parte central.
border-image-source	Define a imagem de origem para criar a imagem de borda de um elemento.
border-image-width	Define a largura da imagem de borda.
border-radius	Cria cantos arredondados para a aresta exterior da borda de um elemento.
border-top-left-radius	Define o arredondamento do canto superior esquerdo do elemento. Existem três tipos de arredondamento.
border-top-right-radius	Define a forma arredondada do canto superior direito do elemento. Existem três tipos de arredondamento.

Propriedades de cor

Propriedade	Descrição
opacity	Especifica a transparência de um elemento.

Flexible Box Layout

Propriedade	Descrição
align-content	Alinha as linhas de um contentor flex quando existe espaço disponível na vertical (no eixo transversal).
align-items	Define o alinhamento predefinido dos itens flex ao longo do eixo transversal.
flex	Especifica os componentes de um comprimento flexível.
flex-basis	Define o tamanho principal inicial do item flexível.
flex-direction	Define o eixo principal de um contentor flex e estabelece a ordem pela qual os itens flex aparecem.
flex-flow	Uma propriedade abreviada (shorthand) para as propriedades flex-wrap e flex-direction.
flex-grow	Especifica o quanto o item irá crescer em relação aos restantes itens do contentor flex.
flex-shrink	Especifica o quanto o item irá encolher em relação aos restantes itens do contentor flex.
flex-wrap	Especifica se os itens flexíveis devem mudar de linha ou não.
justify-content	Alinha os itens quando estes não ocupam todo o espaço disponível na horizontal.
order	Especifica a ordem de um item flexível dentro do contentor flex ou grid.

Propriedades de tipo de letra

Propriedade	Descrição
font-size-adjust	Controla o tamanho do tipo de letra quando o primeiro tipo de letra selecionado não está disponível.
font-stretch	Torna o texto mais estreito ou mais largo.

Propriedades do Multi-column Layout

Propriedade	Descrição
column-count	Especifica o número de colunas em que o conteúdo de um elemento é dividido.
column-fill	Controla o conteúdo do elemento quando este é dividido em colunas.
column-gap	Define a dimensão do espaço entre colunas.
column-rule	Define o estilo, a largura e a cor da linha entre colunas.
column-rule-color	Define a cor da linha.
column-rule-style	Define o estilo da linha entre colunas.
column-rule-width	Define a largura da linha entre colunas.
column-span	Especifica se o elemento se estende por uma coluna ou por todas as colunas.
column-width	Define a largura das colunas.
columns	Uma propriedade abreviada (shorthand) para column-count e column-width.

Propriedades de outline

Propriedade	Descrição
outline-offset	Especifica o espaço entre um outline e a aresta da borda de um elemento.

Propriedades de texto

Propriedade	Descrição
tab-size	Define a largura de um caractere de tabulação.
text-align-last	Define o alinhamento da última linha do texto.
text-decoration-color	Define a cor da decoração do texto.
text-decoration-line	Especifica o tipo de linha que será utilizada na decoração do texto.
text-decoration-style	Especifica o estilo da decoração do texto.
text-justify	Define o comportamento do espaçamento entre palavras ou caracteres.
text-overflow	Especifica como o texto inline em excesso deve ser sinalizado ao utilizador.
text-shadow	Permite adicionar sombras ao texto.
word-break	Especifica onde as linhas devem ser quebradas.
word-wrap	Permite quebrar as linhas em palavras de modo a caberem no seu contentor.

Propriedades de transformação

Propriedade	Descrição
backface-visibility	Especifica se a face traseira de um elemento deve ser visível ou não.
perspective	Confere perspetiva a um elemento posicionado em 3D e determina a distância ao plano z=0.
perspective-origin	Define a posição a partir da qual o utilizador observa o elemento posicionado em 3D.
transform	Especifica a transformação bidimensional ou tridimensional do elemento.
transform-origin	Permite alterar a posição da transformação dos elementos.
transform-style	Especifica como os elementos filhos são renderizados no espaço tridimensional (3D).

Propriedades de transições

Propriedade	Descrição
transition	Propriedade abreviada (shorthand) para as seguintes propriedades: transition-property, transition-duration, transition-timing-function, transition-delay
transition-delay	Especifica quando o efeito de transição deve começar.
transition-duration	Especifica quanto tempo deve demorar a animação de transição.
transition-property	Especifica os nomes das propriedades para a transição.
transition-timing-function	Especifica o andamento da transição ao longo da sua duração, permitindo alterar a velocidade.

Propriedades de formatação visual

Propriedade	Descrição
overflow-x	Especifica se o conteúdo deve ficar oculto, visível ou com deslocamento horizontal quando o conteúdo ultrapassa as arestas esquerda e direita do elemento.
overflow-y	Especifica se o conteúdo deve ficar oculto, visível ou com deslocamento vertical quando o conteúdo ultrapassa as arestas superior e inferior do elemento.
resize	Especifica como o elemento pode ser redimensionado.
box-shadow	Permite implementar várias sombras à volta da caixa, especificando valores para cor, tamanho, desfoque, deslocamento e inset.
box-sizing	Define o cálculo da width e da height de um elemento, caso incluam padding e bordas.

Prática

Was this page helpful?