Tutorial conciso do Dreamweaver 4 (7. Layout da página da Web)

Autor：Eve Cole Data da Última Atualização：2009-05-30 18:35:53

7. Layout da página da web

Uso de tabelas

As tabelas são um elemento muito importante das páginas da web. Como o próprio HTML não fornece mais métodos de layout, muitas vezes precisamos usar tabelas para obter um layout preciso das páginas da web. Pode-se dizer que as tabelas são a habilidade mais importante na produção de páginas da web. A forma como as tabelas são usadas reflete diretamente o nível dos web designers.

Clique no painel de objetos

, você verá a seguinte caixa de diálogo:

① Linhas: o número de linhas da tabela; Colunas: o número de colunas da tabela;

② Largura: Largura da tabela, a unidade pode ser Pixels (número de pixels) ou Porcentagem (porcentagem). O tamanho da tabela definida em pixels é fixo, enquanto a tabela definida em porcentagens mudará de acordo com o tamanho do navegador. A diferença entre os dois métodos de definição será explicada em profundidade posteriormente;

③ Borda: largura da linha da mesa;

④ Preenchimento celular: espaçamento celular; Espaçamento celular: margem celular. A chamada célula refere-se a cada pequena célula da tabela.

Após configurar conforme mostrado na figura, você obterá o seguinte formato:

Clique na linha da tabela para selecionar a tabela inteira. Você pode ver isso no painel de propriedades:

① Linhas, Colunas: linhas e colunas da tabela;

② W, H: A largura e altura da mesa Normalmente não definimos a altura da mesa;

③ CellPad, CellSpace: espaçamento e margens das células: largura das linhas da tabela;

④ Ailgn: Alinhamento da mesa, você pode mover a mesa para a esquerda (Esquerda), centro (Centro) ou direita (Direita)

⑤

: Elimine configurações de altura de linha;

: Elimine configurações de largura de coluna;

: Converta a configuração de largura da tabela de porcentagem para pixels;

: Converta a configuração de largura da tabela de pixels para porcentagem;

⑥ Cor Bg: Defina a cor de fundo da mesa;

⑦ Cor Brdr: Defina a cor da linha da tabela;

⑧ Imagem Bg: Defina a imagem de fundo da mesa. Se a imagem de fundo for definida, a cor de fundo será inválida;

Se movermos o cursor para uma das células, o painel de propriedades que vemos é diferente:

①

: Mesclar células (você deve primeiro selecionar as células correspondentes a serem mescladas);

: Divida as células em várias linhas ou colunas;

② Horz: Alinhamento horizontal dentro da célula, a função é a mesma que

semelhante;
Vert: Alinhamento vertical dentro da célula;

③ W, H: largura e altura da célula;

④ Bg: imagem de fundo da célula;

⑤ Bg: cor de fundo da célula;

⑥ Brdr: cor da borda da célula.