Como criar Absolute-Posicionado (AP) Divs no Adobe Dreamweaver CS6
Adobe Dreamweaver CS6 utiliza recipientes virtuais controlados por CSS, ou caixas, criada pela tag DIV para posicionar livremente conteúdo de uma página. o DIV tag é um tag de base utilizada para criar áreas de conteúdo em sua página.
Você pode criar tags DIV de vários lugares em Dreamweaver, incluindo a seção Layout do painel Inserir. Cada tag DIV pode ter um estilo ID único atribuído a ele para controlar sua posição, aparência e tamanho. O processo de colocação de conteúdo muitas vezes requer duas etapas: criar a tag DIV e, em seguida, criar o seu estilo correspondente.
Dreamweaver torna esta tarefa fácil com a ferramenta AP Div, o que lhe permite desenhar caixas livremente na página e colocar o conteúdo dentro.
CSS trata a maioria dos elementos de contêiner em uma página como caixas- esta abordagem, referida como a modelo CSS Box, permite que estes elementos para compartilhar propriedades uniformes, tais como preenchimento, margens, largura, altura e fronteiras.
Embora CSS pode considerar mais qualquer elemento contendo em uma página como uma caixa (como uma tabela ou uma lista), tags DIV são mais comumente usados para criar caixas virtuais que você pode usar para posicionar o texto, imagens e até mesmo caixas aninhadas.
Cada caixa pode ter sua própria largura, altura, posição (via as propriedades superior e esquerda), fronteira, margens e padding- cada um é definido usando as propriedades CSS apropriadas.
Para criar AP (Absolute-Posicionado) Divs, siga estes passos:
Criar uma nova página ou abrir uma página já existente a partir do seu site.
No painel Inserir, selecione a categoria Layout.
Selecione a ferramenta Desenhar Div PA.
O cursor aparece como uma cruz quando você movê-lo para trás sobre a página.
Clique em qualquer lugar da página e arraste para desenhar uma nova AP divi- solte o botão do mouse.
Mova o ponteiro do mouse sobre a borda da caixa até que ele mude para um 4-way da seta clique uma vez e alças aparecem por todos os lados.
Clique e arraste qualquer uma dessas alças para redimensionar a caixa verticalmente ou horizontalmente.
Para mover a caixa, clique e arraste-a pela aba que fica em sua borda superior esquerda e coloque a caixa onde você quiser na página.
Dê uma olhada no Inspetor de propriedades, e você vê o nome, bem como muitas propriedades DIV listados.
Se o painel Estilos CSS não é aberto, escolha Estilos Window-CSS para abrir ele- sob All painel, clique no lado esquerdo da folha de estilo () para expandi-lo.
Você vê um novo # apDiv1 estilo ID, que é conectada ao novo AP Div você criou. Para cada novo DIV criados, cessionários Dreamweaver apDiv com um número correspondente, a fim de criação.
Clique dentro da nova caixa para digitar, colar ou inserir novos conteúdos.
Quando você desenha uma Div PA na página, ocorrem duas coisas: Dreamweaver insere uma tag para criar a caixa e cria um seletor ID CSS que armazena a posição do DIV, largura, altura e outras propriedades.
Depois de criar uma Div PA, você pode digitar, colar ou inserir conteúdo diretamente no seu interior. Você também pode atribuir uma regra de classe para qualquer DIV do Inspetor de propriedades - na maioria das vezes para lidar com a formatação de conteúdo, deixando o selector de ID para controlar o posicionamento e dimensões.