A sintaxe do CSS3

A sintaxe do CSS3 (Cascading Style Sheets 3) é composta por uma série de regras que definem como os elementos HTML devem ser estilizados na página da web. Cada regra de estilo consiste em uma propriedade e um valor separados por dois pontos (:), seguidos por um ponto-e-vírgula (;). Por exemplo:

seletor {
propriedade: valor;
}

O seletor

O seletor é o elemento HTML que está sendo estilizado, como uma tag `<h1>` ou uma classe `.container`. A propriedade é o aspecto do estilo que está sendo definido, como a cor do texto ou a largura da borda. O valor é a especificação exata da propriedade, como “vermelho” ou “2px”.

É possível incluir várias propriedades em uma regra, separando-as com ponto-e-vírgula, como:

seletor {
propriedade1: valor1;
propriedade2: valor2;
propriedade3: valor3;
}

Agrupando seletores

Além disso, também é possível agrupar vários seletores em uma única regra, separando-os por vírgulas, como:

seletor1, seletor2, seletor3 {
propriedade: valor;
}

Outros elementos

O CSS3 também introduziu várias novas propriedades e valores, bem como seletores mais avançados, como seletores de atributos e pseudo-classes, que permitem estilizar elementos com base em seu estado ou características específicas. Os quais incluem:

  • Comentários: podem ser incluídos no código utilizando `/* comentário */`
  • Seletores avançados: permitem selecionar elementos com base em outras condições além do nome da tag, como classes, IDs ou atributos
  • Valores relativos: permitem especificar valores relativos a outras propriedades, como o tamanho da fonte ou a largura da tela
  • Valores múltiplos: algumas propriedades permitem a inclusão de múltiplos valores, separados por espaço ou vírgula

Referência no W3C

https://www.w3.org/TR/css-2023/#css-official