SINTAXE BÁSICA DO CSS E SELETORES

1. Sintaxe Básica do CSS

O CSS é escrito através de regras de estilo. Cada regra é composta por um seletor e um bloco de declarações. O seletor indica qual elemento HTML será estilizado, enquanto as declarações definem como esse elemento irá aparecer.

Estrutura básica de uma regra CSS:

seletor {
  propriedade: valor;
}

Exemplos do que compõe a sintaxe do CSS:
• Seletor – escolhe o elemento HTML;
• Propriedade – define o que será alterado;
• Valor – indica como será a alteração;
• Cada declaração termina com ponto e vírgula (;).

2. Seletores Simples em CSS

Os seletores são usados para indicar quais elementos HTML receberão estilo. Os principais seletores simples são:

• Seletor de elemento (tag): seleciona elementos pelo nome da tag;
• Seletor de classe: seleciona elementos que possuem uma classe específica;
• Seletor de ID: seleciona um elemento com identificador único;
• Seletor universal: seleciona todos os elementos da página.

3. Tipos de Seletores Simples

3.1 Seletor de Elemento

O seletor de elemento utiliza o nome da tag HTML e aplica o estilo a todos os elementos desse tipo.

Exemplo:

p {
  color: blue;
}

Características:
• Aplica o estilo a todas as tags iguais;
• É simples e muito utilizado;
• Possui baixa prioridade em relação a classes e IDs.

3.2 Seletor de Classe

O seletor de classe é identificado por um ponto (.) e permite aplicar estilos a vários elementos diferentes.

Exemplo:

.texto {
  font-size: 18px;
}

Características:
• Pode ser reutilizado em vários elementos;
• Usa o ponto (.) antes do nome;
• É muito comum no desenvolvimento web.

3.3 Seletor de ID

O seletor de ID utiliza o símbolo # e identifica um único elemento na página HTML.

Exemplo:

#principal {
  background-color: lightgray;
}

Características:
• Deve ser único na página;
• Usa o símbolo #;
• Possui maior prioridade que classes e elementos.