domingo, 14 de março de 2010

CSS - Folhas de Estilo

Um avanço interessante na linguagem HTML após a versão 3.2 foi a introdução das Style Sheets ou Cascading Style Sheets. Essas folhas de estilo permitem o uso de formatações uniformes em um site, de maneira bastante "econômica".
Logo nas primeiras aulas de HTML, vimos que, para poder formatar um texto,
(Cores e fontes de textos) era preciso escrever uma marcação parecida com:

para ter o resultado:
      Um título genérico

Um texto genérico com algum destaque qualquer junto, após um título genérico, etc.
Acontece que, de um documento para outro, pode acontecer de esquecermos o tamanho da fonte usada no texto, qual a fonte ou a cor dos títulos de determinada subseção, e a uniformidade de apresentação das páginas acaba ficando prejudicada.
Com as folhas de estilo, podemos declarar estilos apropriados para seções de texto, aplicando esses estilos sem nos preocuparmos com detalhes de fontes, cor e tamanhos.
E mais: se for necessário modificar algum dia as cores de todos os títulos ou dos destaques ao longo dos textos, simplesmente alteramos a folha de estilo, atualizando imediatamente a apresentação de todos os documentos que fazem referência a ela.
Para o exemplo acima, poderíamos criar a seguinte folha de estilo: 


E assim, para ter o mesmo resultado do exemplo acima, a formatação seria muito mais simples que a primeira:
A definição da folha de estilo deve ficar dentro de HEAD, da seguinte forma, se a folha for definida dentro do mesmo documento em que está sendo usada:
Ou então, quando a folha de estilo é definida externamente:

Neste caso, uma mesma folha de estilo pode ser usada por vários documentos HTML, que também poderão ter suas próprias folhas de estilo internas.

Fonte: http://www.icmc.usp.br/ensino/material/html/css.html

Nenhum comentário:

Postar um comentário