O Que é E Pra Que Serve <div>

[Skin_]

Olá pessoal...

estou lendo que essa tag <DIV></DIV> pode ser utilizada na criação de janelas, de áreas de texto...

como isso funciona?

pra que mais serve?

Obrigado!

Skin_

[ppgsalomao]

Indica que a <tag> influenciada é uma divisão com caracteristicas próprias.

atributos.

POSITION -> posicionamento da camada. Pode ser ABSOLUTE (absoluto), que toma o início do documento como referência ou RELATIVE (relativo), que tema algum objeto como referência.

TOP ou BOTTOM -> posiciomento (normalmente em pixels (px)) da camada. Usa-se TOP quando se posiciona levando em consideração o topo de nossa referência (documento ou objeto) e BOTTOM quando usa-se a base como referência.

LEFT ou RIGHT -> posiciomento (normalmente em pixels (px)) da camada. Usa-se LEFT quando se posiciona levando em consideração a esquerda de nossa referência (documento ou objeto) e RIGHT quando usa-se a direita como referência.

WIDTH -> Largura (normalmente em px. O uso de % é possível, mas não é garantido o uso em todos os browsers) da camada.

HEIGHT -> Altura (normalmente em px. O uso de % é possível, mas não é garantido o uso em todos os browsers) da camada.

ZINDEX -> Define a profundidade (o plano) no qual a camada está. Usa-se somente números inteiros que variam entre 1 a infinito. O número máximo que eu já vi, foi 1000; portanto até 1000 eu garanto! HEHEHE... ah, o exemplo: 10.

BACKGROUND -> atribui uma cor de fundo ou uma imagem na camada. Para a cor de fundo, pode-se usar o nome da cor (por ex.: black (preto), white (branco)), o código Hexadecimal (por ex.: #000000 (preto), #FFFFFF (branco)) ou o código RGB da cor (por ex.: rgb(0,0,0) (preto), rgb(255,255,255) (branco)). pra atribuir uma imagem, url(path/imagem.ext). Não um BACKGROUND, significa deixá-lo transparente.

BORDER -> atribui uma borda na camada. Primeiro, define-se a espessura da borda, depois a cor e logo em seguida o tipo. Quando se escreve dentro da tag style a borda, normalmente usa-se a espessura, o tipo e a cor. A borda, pode ser de cor sólida, tracejada, em pontos, etc. Para melhorar a explicação, vou colocar aqui alguns tipos de borda: dotted, dashed, solid, double, groove, ridge, inset, window-inset, outset. Sugiro que você teste todos os estilos de borda, para se familiarizar com elas. Para concluir sobre BORDER, falta o exemplo: 3px solid rgb(0, 0, 0). Aqui definimos uma borda com 3px de espessura, do tipo sólido e da cor preta.

VISIBILITY -> Base do nosso tutorial, que é a alternância entre mostrar/esconder camadas. Com este atributo, você pode deixar a camada visível (visible ou show), invisível (hidden ou none)

Exemplo:

<DIV ID="teste" STYLE="POSITION: absolute; TOP: 5px; LEFT: 5px; WIDTH: 400px; HEIGHT: 300px; ZINDEX: 2; BACKGROUND: #FFFFFF; BORDER: 3px VISIBILITY: visible;">

Algum conteúdo

</DIV>

Retirado de http://www.dwonline.com.br/