Escrevendo HTML corretamente - Parte III

Escrito por Felipe em 02 de março de 2008 – 10:38 am -

Atrasei, sei disso, mas foi por motivos maiores… Estive ocupado em estudar… Então, continuo a série de artigos hoje, falando sobre CSS.

Imagine a seguinte situação: você tem uma empresa que vende alimentos, por exemplo, e as cores da empresa são vermelho e amarelo. Você é responsável pelo site, não sabe nada de PHP, muito menos de CSS.

Você, se achando o máximo, escreve o código HTML com dezenas de color, <font>… Bom, funciona, mas e se sua empresa se fundisse com outra e as cores passassem a ser azul e amarelo. Você editaria as, possíveis, centenas de páginas?

É aí que entra a vantagem do CSS.

Copiando o que está na Wikipédia:

Sua necessidade adveio do fato de o HTML (Hyper Text Markup Language) aos poucos ter deixado de ser usado apenas para criação de conteúdo na web, e portanto havia uma mistura de formatação e conteúdo textual dentro do código de uma mesma página. Contudo, na criação de um grande portal, fica quase impossível manter uma identidade visual, bem como a produtividade do desenvolvedor. É nesse ponto que entra o CSS.

Ah, você deve estar se perguntando: mas que p**** é essa de CSS? CSS, ou em bom português, Folha de Estilos em Cascata.

Por que esse nome? Quando você escreve em HTML, igual o exemplo que citei, você teria, de certa forma, um estilo para cada página. Com CSS, você tem um estilo para todas as páginas. Ou seja, para mudar as cores do site, bastariam editar poucas linhas.

Basicamente, para ‘linkar’ uma página à um arquivo CSS, basta adicionar a linha:

<link rel="stylesheet" href="ENDEREÇO DO ARQUIVO CSS" type="text/css" />

É possível adicionar um estilo global à tag, estilo em uma classe, ou estilo em um objeto. Que? Vou exemplificar:

h1 {
  background-color: #f00;
}

.codigo {
  font-family: Arial, Verdana, sans-serif;
}

#busca {
  border: 1px solid #F60;
}

Quando eu linkar esse CSS à uma página, todos os título aparecerão em vermelho, todas as tags com class="codigo" aparecerão com a fonte Arial, Verdana ou outra fonte parecida e o objeto que tiver id="busca" terá uma borda em um vermelho-alaranjado.

Se você quiser aprender mais sobre CSS, recomendo o site do Maujor.

Postado em Tutorial |

Nenhum comentário to “Escrevendo HTML corretamente - Parte III”

  1. Fábio disse:
    março 7th, 2008 at 4:00 pm

    vi em algum lugar seu interesse pelo Android….

    já entrou nesse site? http://www.portalandroid.org

    até mais!

Comente!