Usos mágicos das tabelas do DreamWeaver - explicação detalhada da produção de wireframe (5)
Autor:Eve Cole
Data da Última Atualização:2009-05-30 18:36:21
4> Produção de bordas espaçadoras
A "borda lacuna" é usada principalmente para organizar a lista de itens de cada coluna ou canal na página web, para facilitar o entendimento de todos, o autor primeiro mostrará as renderizações após a conclusão da produção, da seguinte forma:
A seguir está o processo de produção correspondente (tomando como exemplo a produção de espaçamento de três quadros)
Primeiro, insira um objeto de tabela com 1 linha e 3 colunas na página da web. Durante o processo de inserção, defina diretamente "Border" como 0, "CellSpace" como 2 e "CellPad" como 1, conforme mostrado na figura.
Nota: As configurações aqui são completamente equivalentes às do painel de propriedades.
Mantenha pressionado o botão esquerdo do mouse e arraste cada célula para selecionar 3 objetos de célula ao mesmo tempo. Defina seu "Bgcolor" como "Red" no painel de propriedades. Observe que esta cor é a cor da borda da medianiz.
Para conseguir o efeito de espaçamento, utilizaremos aqui a produção de “mesas aninhadas”. O autor primeiro diz algumas coisas que você deve prestar atenção ao projetar tabelas "aninhadas". Ao inserir uma tabela em uma célula, é melhor definir os atributos de posicionamento do conteúdo da célula "Horz" (posição esquerda e direita) e "Vert". " (posição para cima e para baixo), respectivamente. Defina como "Esquerda" e "Superior" para evitar problemas desnecessários ao ajustar o tamanho da tabela aninhada novamente. Basta arrastar o canto inferior direito para fazer isso. do seguinte modo
Insira um objeto de tabela em três células por vez, defina "Border", "CellSpace" e "CellPad" como "0" e defina a cor de fundo de cada tabela no painel de propriedades para a mesma página. A cor de fundo é " branco". Outro ponto é definir "Largura" e "Altura" para "100%" no estado de exibição proporcional, para que possa preencher automaticamente toda a unidade de acordo com o tamanho. grade.
Agora você pode visualizar o efeito.
Na produção da borda da calha, a diferença da borda da linha fina é que a largura da borda 1 é obtida através do atributo "CellPad" em vez do "CellSpace" anterior. O "CellPad" aqui se refere à distância da célula. entre o conteúdo e o limite da célula Não há dúvida de que as outras três tabelas que inserimos como conteúdo neste exemplo são. Em seguida, ajustar "CellSpace" pode alterar o espaçamento entre cada borda, como o efeito de "6" unidades
Da mesma forma, você pode criar bordas verticais de medianiz de maneira semelhante.
Acima analisamos cuidadosamente o processo de produção, princípios e métodos de ajuste de vários tipos de bordas comuns em páginas da web. Acredito que a comparação da forma de efeito é mais propícia à compreensão de cada um sobre suas respectivas diferenças, aprofundando assim sua impressão. É claro que espero que todos possam encontrar mais efeitos de fronteira de acordo com ideias de design semelhantes.