Se você está visualizando este post no topo do blog, já deve ter se perguntado: Por que o blog está tão esquisito?

Como prometi, esta semana o blog muda o visual. Mas antes faremos uma pequena demonstração da importância do Código CSS (Cascade Style Sheet) e da estrutura de um site.

O Código CSS aplica o visual em todas as páginas de um site, através de estilos. Ele pode determinar desde a cor de um link até a largura e posição exata de um determinado campo da página.

O estilo (nome dado aos conjuntos de características aplicados pelo CSS) até pode ser inserido diretamente em cada elemento. Mas isso não é nada prático. Imagine se um dia você se cansa de colocar todos os títulos de um site, com várias páginas, em vermelho, e decide mudá-los para verde? A mão isso é terrível. Com CSS basta a seguinte mudança:

• Antes:

h1 { color: red; }

• Depois:

h1 { color: green; }

Pronto. Se o site tiver 1.000 páginas, as 1.000 estão atualizadas. Mais que isso até: cada título novo que você coloca, automaticamente ele assume as características pré-estabelecidas por você.

E sem o CSS, o site assume as características padrões do navegador usado. Supondo que você esteja agora no Opera, se mudar para o Chrome perceberá algumas diferenças. O Browser representa o nível mais alto da “cascata de estilo“, consequentemente, só aparecerá se não houver nenhum outro estilo aplicado, em nenhum outro nível da página.

Mas um site não vive só de estilo. Ele precisa de uma estrutura básica para publicar o conteúdo (no caso aqui do blog, armazenado num banco de dados MySQL).

Basicamente existem dois tipos de estrutura: Tabela e Div.

Na tabela podemos inserir características diretamente em cada linha, coluna ou célula, tais como largura, altura e cor. É possível também determinar parâmetros a toda ela de uma vez (largura, espaço entre células, margens internas, etc).

O problema maior é a quantidade de código para gerar a tabela: se ela tiver apenas uma célula teria todas estas tags:

<table cellspacing="0" cellpadding="0">
<tr>
<td>conteúdo</td>
</tr>
</table>

Feito com Div teria apenas:

<div>conteúdo</div>

Mas div é assunto para quarta-feira.

Fora isso, temos que considerar que o que afeta uma célula pode afetar a coluna ou a linha toda.

Bom… Quarta-feira, continuaremos a transição com a estrutura do novo visual, ainda sem o CSS aplicado.