terça-feira, 12 de outubro de 2010

Introdução: A tag div

A tag <div> define uma divisão num documento HTML.
A tag <div> é também usada para dividir as páginas em blocos.
A tag div também é usada com css para contruir layouts.

É suportada pelo Internet Explorer, Mozilla Firefox, Opera, Google Chorme e Safari.

Atributos

Opcionais:

- Align

Standard:

- class
- dir
- id
- lang
- style
- title
- xml:lang

Event:

- onclick
- ondblclick
- onmousedown
- onmousemove
- onmouseout
- onmouseover
- onmouseup
- onkeydown
- onkeypress
- onkeyup

Vantagens

Na grande maioria dos sites baseados em CSS, o layout de uma página é feito recorrendo ao modelo de caixas. Este método consiste em agrupar elementos dentro de caixas e proceder ao seu posicionamento na página.
Uma das vantagens é evitar a utilização de tabelas, obtendo os mesmos resultados, mas com um grau de eficiência e flexibilidade maior e ainda serve para alinhar e formatar textos.

Tem a vantagem de ser melhor reconhecido, ou seja, procura apresentar a mesma aparência em diferentes tipos de navegadores e apresentar um código-fonte mais limpo, já que os estilos e outros recursos como JavaScript ficarão em arquivos externos.
Esta maneira de criar páginas também facilita ao desenvolvedor na hora de efectuar actualizações, já que um único arquivo CSS pode estar vinculado a várias páginas.
As tabelas, anteriormente usadas para estruturar o layout, tem seu uso específico para dados que exijam este tipo de exibição, como por exemplo um estudo comparativo de produtos, um planos com horários de vôo, preços, etc.

Os frames estão em total desuso.

As divs podem possuir estilos, como uma tabela, como bordas, cor ou imagem de background, ou ficarem invisíveis e apenas servir de "delimitadores" para posicionar conteúdo em uma página.

Div e Css

Código estilo css:

.large {
  color: #00FF00;
  font-family:arial;
  font-size: 4pt;
}

Código Html:

<div class="large">
  This is a DIV sample.
</div>