Guia CSS > Conceitos Básicos > Regra CSS
Uma Regra CSS é uma declaração que define estilo a um ou mais elementos na sua página. Essa Regra tem uma sintaxe própria:
- Seletor: indica o elemento HTML que você deseja adicionar o estilo;
- Bloco de Declaração: contém uma ou mais declarações separadas por ponto e vírgula. Cada declaração leva uma propriedade CSS e um Valor separados por dois pontos;
- Propriedade: é um aspecto do elemento HTML que será modificado (por exemplo: font-size, color, background, etc);
- Valor: é a característica específica a ser assumida pela propriedade (por exemplo: fonte de 16px, cor vermelha, fundo azul).
Exemplo de Regras CSS:
h1 {
color: red;
}
.top-box {
background-color: blue;
width: 100%;
}
Podemos ter mais de um seletor em uma regra CSS, fazendo com que tenhamos menos repetição de código quando elementos compartilharem as mesmas propriedades. Para usarmos múltiplos seletores basta separa-lós por vírgula:
h1,
h2,
p {
font-family: Helvetica, Arial, sans-serif;
color: darkgray;
}
Conceitos Básicos
O que é CSS? | Adicionando estilo ao HTML | Regra CSS | CSS Box Model