CSS – Seletores básicos

1 – “*”
Seleciona todos os marcadores html.

Exemplo:


*{
   margin: 0;
   padding: 0;
}

O seletor “*” também pode ser utilizado para selecionar os marcadores html “filhos” de um marcador div.

Exemplo:


#container *{
     border: 1px solid black; 
}

2 – “#[identificador]”
Seleciona o marcador html cujo id (identificador) coincide com o parâmetro passado ao operador “#”.

Exemplo:

#container{
     width: 960px;
     margin: auto;
}

3 – “.[classe]”
Seleciona os marcadores html cujo atributo class coincidam com o parâmetro passado ao operador “.”.

Exemplo:

.destacado{
   color: red;
}

4 – “seletor1 seletor2”
Esse é um pouco mais complicado, é utilizado para selecionar os marcadores html contemplados pelo seletor2 que sejam descendentes dos elementos contemplados pelo seletor1.

Exemplo:

div p{
     color: blue;
}

Nesse exemplo, todos os parágrafos contidos em elementos div serão impactados.

5 – “[tipo_de_marcador]”
Permite selecionar os marcadores html de acordo com o tipo.

Exemplo:

a{
     color: green;
}

p{
     color: yellow;
}

Todos os elementos do tipo âncora (a) receberão a cor verde e os elementos do tipo parágrafo (p) a cor amarela.

Deixe um comentário