Blog do web designer Paulo Victor

Nessa parte do artigo que ensina como construir uma página de um site, usando o tableless (HTML+ CSS), veremos algumas regras básicas do CSS:

Quando se inicia um bloco com “#” significa que você vai estilizar um elemento especificando-o pelo seu id (nome de identificação).
Ex.:

#topo{
/* atributos de estilização do elemento “topo” */
}

Já quando você inicia o bloco com um “.”, você está estilizando uma classe de elementos.
Ex.:

.box{
/* atributos de estilização da classe “box” */
}

Quando inicia-se o bloco sem um caractere especial, significa que está sendo estilizado uma tag da sua página HTML.
Ex.:

p{
/* atributos de estilização da tag <p> */
}

Quando no início do bloco está uma tag de HTML e se coloca “:” e outra palavra depois, significa que está sendo estilizado um estado específico de uma tag HTML.
Ex.:

a:hover{
/* atributos do estado over da tag <a> */
}

Obs.: uma declaração pode começar com uma tag, seguida de uma classe ou id, assim, aquele id ou classe especificado será válido somente para aquela tag.
Ex.: div#menu – o id menu estilizado ali vale somente para a tag <div>
Pode-se estilizar elementos específicos que estão aninhados em outros elementos no HTML.
Exemplo:
div#topo div#menu – significa que está sendo estilizado a div “menu”, que no HTML está aninhada dentro da div “topo”.

Clique aqui e vá para a próxima parte do artigo, onde veremos como será nosso arquivo CSS.

- Construindo uma página (site) usando Tableless
Ir para:
- Parte 1 | Parte 2 | Parte 3 | Parte 4 | Parte 5