layouts div são projetos para páginas da Web que incluem recipientes para o conteúdo da Web, tais como imagens, texto e links. Eles ajudam a manter uma aparência uniforme para páginas da web. Adobe Photoshop de "Slice Tool" e "Salvar para a Web & Devices" comandos permitem aos usuários criar um layout Div visualmente adicionando elementos de página e, em seguida, a criação de recipientes directamente sobre o layout, em vez de usar código HTML e CSS ou depender de layouts div pré-fabricados, que também requerem conhecimento de código para personalizar.
Coisas que você precisa
- software Adobe Photoshop
Abra o Photoshop e crie um novo documento Web, selecionando "Arquivo gt; Novo" no menu do aplicativo e definir a "predefinido" drop-down para "Rede." Defina suas dimensões desejadas para o seu layout no "Largura" e "Altura" campos, ou selecionar um dos tamanhos de layout da Web padrão da "Tamanho" suspenso.
Adicione suas imagens visuais desejados para seu layout. Estas imagens podem incluir importados usando o "Arquivo gt; Lugar" comando, formas, botões ou de texto criado com o "Tipo de ferramenta."
Selecione os "Slice Tool" a partir do Painel de Ferramentas e corte cada elemento do seu layout, clicando e arrastando-o com o "Slice Tool" selecionado. Criar fatias individuais para cada elemento de texto, botão, imagem ou linha. Estas fatias servirá como os elementos Div em seu layout de Web.
Clique no "Arquivo" menu e selecione "Salvar para a Web & Devices" para abrir a caixa de diálogo otimização, o que lhe permitirá configurar cada elemento do seu layout para que melhor possa ser exibido na Web. Ajustar as configurações de cada fatia criada clicando sobre o uso de cada um individualmente o "Slice Select Tool" no canto superior esquerdo da caixa de diálogo e alterar as configurações de formato, qualidade e de cor de acordo com o direito da caixa. Clique "Salvar" quando você tem otimizado cada fatia com suas preferências.
Nomeie o arquivo de layout e selecione um local para ele nos campos indicados da "Salvar Otimizado Como" caixa de diálogo. Mudar o "Formato" suspenso "HTML e imagens" e certifique-se a "Configurações" e "Slices" menus suspensos estão definidas para "Configurações padrão" e "todas as Fatias" respectivamente. Clique "Salvar." A disposição está agora pronto para ser aberto em um Web-editor como o Dreamweaver, onde você pode adicionar links e comportamentos para as seções Div você criou com o "Ferramenta de fatia."