Sintaxe CSS

Índice

    Mostrar índice

Uma regra CSS consiste em um seletor e um bloco de declaração.

Sintaxe CSS

O seletor aponta para o elemento HTML que você deseja estilizar.

O bloco de declaração contém uma ou mais declarações separadas por ponto e vírgula.

Cada declaração inclui um nome de propriedade CSS e um valor, separados por dois pontos.

Múltiplas declarações CSS são separadas por ponto e vírgula e declaração os blocos são cercados por chaves.

Exemplo

Neste exemplo, todos os elementos <p> serão alinhados ao centro, com um vermelho cor do texto:

p
{
  color: red;
  text-align: center;
}

Experimente você mesmo →

<!DOCTYPE html>
<html>
<head>
<style>
p {
  color: red;
  text-align: center;
} 
</style>
</head>
<body>

<p>Hello World!</p>
<p>These paragraphs are styled with CSS.</p>

</body>
</html>

Exemplo explicado

  • p é um seletor em CSS (ele aponta para o elemento HTML que você deseja estilizar: <p>).

  • color é uma propriedade e red é o valor da propriedade

  • text-align é uma propriedade e center é o valor da propriedade

Você aprenderá muito mais sobre seletores CSS e propriedades CSS nos próximos capítulos!