- Guia do usuário do Dreamweaver
- Introdução
- Dreamweaver e Creative Cloud
- Áreas de trabalho e exibições do Dreamweaver
- Configurar sites
- Sobre sites do Dreamweaver
- Configurar uma versão local do site
- Conectar-se a um servidor de publicação
- Configurar um servidor de teste
- Importar e exportar configurações de site do Dreamweaver
- Trazer sites existentes de um servidor remoto para a raiz do site local
- Recursos de acessibilidade do Dreamweaver
- Configurações avançadas
- Definir preferências de site para transferência de arquivos
- Especificar configurações do servidor proxy no Dreamweaver
- Sincronizar as configurações do Dreamweaver com a Creative Cloud
- Como usar o Git no Dreamweaver
- Gerenciar arquivos
- Criar e abrir arquivos
- Gerenciamento de arquivos e pastas
- Obter e colocar arquivos no servidor
- Devolver e retirar arquivos
- Sincronizar arquivos
- Comparar arquivos em busca de diferenças
- Encobrir arquivos e pastas em seu site do Dreamweaver
- Ativar as Design Notes para sites do Dreamweaver
- Impedir possível ataque ao Gatekeeper
- Layout e design
- CSS
- Noções sobre as folhas de estilos em cascata
- Aplicar layout às páginas usando o CSS Designer
- Usar pré-processadores de CSS no Dreamweaver
- Como definir preferências de estilo CSS no Dreamweaver
- Mover regras de CSS no Dreamweaver
- Converter CSS inline em uma regra de CSS no Dreamweaver
- Trabalhar com tags div
- Aplicação de degradês ao fundo
- Criar e editar efeitos de transição do CSS3 no Dreamweaver
- Formatar código
- Conteúdo e ativos de página
- Definir propriedades da página
- Configurar propriedades de cabeçalho e propriedades de link de CSS
- Trabalhar com texto
- Localizar e substituir texto, tags e atributos
- Painel DOM
- Editar na Visualização dinâmica
- Codificar documentos do Dreamweaver
- Selecionar e exibir os elementos na janela Documento
- Definir propriedades de texto no Inspetor de propriedades
- Verificar ortografia de uma página Web
- Usar regras horizontais no Dreamweaver
- Adicionar e modificar combinações de fontes no Dreamweaver
- Trabalhar com ativos
- Inserir e atualizar datas no Dreamweaver
- Criar e gerenciar ativos favoritos no Dreamweaver
- Inserir e editar imagens no Dreamweaver
- Adicionar objetos de mídia
- Adição de vídeos no Dreamweaver
- Inserir vídeo HTML5
- Inserir arquivos SWF
- Adicionar efeitos de áudio
- Inserir áudio HTML5 no Dreamweaver
- Trabalhar com itens da biblioteca
- Usar texto em árabe e hebraico no Dreamweaver
- Vinculação e navegação
- Efeitos e widgets do jQuery
- Programar sites
- Sobre codificação no Dreamweaver
- Ambiente de codificação no Dreamweaver
- Definir preferências de codificação
- Personalizar codificação por cores
- Escrever e editar código
- Dicas de código e preenchimento de código
- Recolher e expandir código
- Reutilizar código com snippets
- Linting de código
- Otimizar código
- Editar código na Visualização de design
- Trabalhar com conteúdo do cabeçalho das páginas
- Inserir inclusões de servidor no Dreamweaver
- Usar bibliotecas de tags no Dreamweaver
- Importar tags personalizadas para o Dreamweaver
- Usar comportamentos JavaScript (instruções gerais)
- Aplicar comportamentos internos do JavaScript
- Sobre XML e XSLT
- Executar transformações XSL do servidor no Dreamweaver
- Executar transformações XSL do cliente no Dreamweaver
- Adicionar entidades de caracteres para XSLT no Dreamweaver
- Formatar código
- Fluxos de trabalho entre produtos
- Instalar e usar extensões no Dreamweaver
- Atualizações dentro do aplicativo no Dreamweaver
- Inserir documentos do Microsoft Office no Dreamweaver (somente Windows)
- Trabalho com o Fireworks e o Dreamweaver
- Editar conteúdo em sites do Dreamweaver usando o Contribute
- Integração do Business Catalyst ao Dreamweaver
- Criar campanhas de email personalizadas
- Modelos
- Sobre os modelos do Dreamweaver
- Reconhecimento de modelos e documentos baseados em modelo
- Criar um modelo do Dreamweaver
- Criar regiões editáveis nos modelos
- Criar regiões e tabelas repetitivas no Dreamweaver
- Usar regiões opcionais em modelos
- Definir atributos de tag editáveis no Dreamweaver
- Como criar modelos aninhados no Dreamweaver
- Editar, atualizar e excluir modelos
- Exportar e importar conteúdo xml no Dreamweaver
- Aplicar ou remover um modelo em um documento
- Editar conteúdo em modelos do Dreamweaver
- Regras de sintaxe para tags de modelo no Dreamweaver
- Definir preferências de realce para regiões de modelo
- Vantagens de usar modelos no Dreamweaver
- Dispositivo móvel e multitela
- Sites dinâmicos, páginas e formulários Web
- Noções sobre aplicativos Web
- Configurar o computador para desenvolvimento de aplicativos
- Solucionar problemas de conexões de banco de dados
- Remover scripts de conexão no Dreamweaver
- Criar páginas dinâmicas
- Visão geral das fontes de conteúdo dinâmico
- Definir origens de conteúdo dinâmico
- Adicionar conteúdo dinâmico a páginas
- Alterar conteúdo dinâmico no Dreamweaver
- Exibir registros de banco de dados
- Fornecer e solucionar problemas de live data no Dreamweaver
- Adicionar comportamentos personalizados de servidor no Dreamweaver
- Criar formulários usando o Dreamweaver
- Usar formulários para reunir informações de usuários
- Criar e ativar formulários do ColdFusion no Dreamweaver
- Criar formulários Web
- Suporte aprimorado a HTML5 para elementos de formulário
- Desenvolver um formulário usando o Dreamweaver
- Criação visual de aplicativos
- Criar páginas mestre e detalhadas no Dreamweaver
- Criar páginas de pesquisa e de resultados
- Criar uma página de inserção de registro
- Criar uma página de registro de atualização no Dreamweaver
- Criar páginas de exclusão de registro no Dreamweaver
- Usar comandos ASP para modificar um banco de dados no Dreamweaver
- Criar uma página de registro
- Criar uma página de logon
- Criar uma página que apenas usuários autorizados podem acessar
- Proteger pastas no ColdFusion usando o Dreamweaver
- Usar componentes do ColdFusion no Dreamweaver
- Testar, visualizar e publicar sites
- Solução de problemas
Saiba como adicionar e formatar texto na Visualização dinâmica, Visualização de código ou extraindo o texto e as propriedades associadas de arquivos PSD.
Adicionar texto a um documento
Para adicionar texto a um documento do Dreamweaver, digite o texto diretamente na janela Documento ou recorte e cole o texto. Também é possível importar texto de outros documentos.
Quando você colar texto em um documento do Dreamweaver, use o comando Colar ou Colar especial. O comando Colar especial permite especificar o formato do texto colado de diferentes formas. Por exemplo, se você deseja colar texto de um documento formatado do Microsoft Word no documento do Dreamweaver, mas deseja retirar toda a formatação para que possa aplicar sua própria folha de estilos CSS ao texto colado, selecione texto no Word, copie-o para a área de transferência e use o comando Colar especial para selecionar a opção que permite colar apenas texto.
Ao usar o comando Colar para colar texto de outros aplicativos, defina as preferências de colagem como opções padrão.
A combinação de teclas Control+V (Windows) e Command+V (Macintosh) sempre cola apenas texto (sem formatação) na Visualização de código.
-
Adicione texto ao documento seguindo um destes procedimentos:
- Extraia o texto de suas composições de PSD usando o painel Extract. Para obter informações detalhadas, consulte Copiar texto dos arquivos PSD.
- Digite o texto diretamente na janela Documento.
- Copie o texto de outro aplicativo, alterne para o Dreamweaver, posicione o ponto de inserção na Visualização de design da janela Documento e selecione Editar > Colar ou Editar > Colar especial.
Ao selecionar Editar > Colar especial, selecione várias opções de formatação de colagem.
Você também pode colar texto usando os seguintes atalhos de teclado:
opção Colar
Atalho de teclado
Colar
Control+V (Windows)
Command+V (Macintosh)
Colar especial
Control+Shift+V (Windows)
Command+Shift+V (Macintosh)
Inserir caracteres especiais
Determinados caracteres especiais são representados em HTML por um nome ou número, denominado entidade. O HTML inclui nomes de entidades para caracteres, como símbolo de direitos autorais (©), E comercial (&) e símbolo de marca registrada (®). Cada entidade possui um nome (como —) e um equivalente numérico (como —).
O HTML usa os colchetes angulares <> em seu código, mas talvez seja necessário expressar os caracteres especiais de sinal de maior que ou sinal de menor que sem que o Dreamweaver os interpretem como código. Nesse caso, use &gt; como sinal de maior (>) e &lt; como sinal de menor (<).
Infelizmente, muitos navegadores mais antigos não exibem adequadamente várias das entidades denominadas.
-
Na janela Documento, coloque o ponto de inserção no local em que deseja inserir um caractere especial.
-
Siga um destes procedimentos:
Selecione o nome do caractere em Inserir > HTML > Caractere.
Na categoria HTML do painel Inserir, clique na opção Caracteres e selecione o caractere no menu pop-up.
Observação:Há vários outros caracteres especiais disponíveis. Para selecionar um deles, selecione Inserir > HTML > Caractere > Outros... ou clique no botão Caracteres na categoria HTML do painel Inserir e selecione a opção Outros caracteres. Selecione um caractere na caixa de diálogo Inserir outro caractere e clique em OK.
Adição de espaço entre caracteres
O HTML permite apenas um espaço entre os caracteres. Para adicionar espaços extras em um documento, insira um espaço não separável. É possível definir uma preferência para adicionar automaticamente espaços não separáveis em um documento.
Inserção de um espaço não separável
-
Siga um destes procedimentos:
Selecione Inserir > HTML > Caracteres especiais > Espaço não separável.
Pressione Control+Shift+Barra de espaços (Windows) ou Option+Barra de espaços (Macintosh).
No painel Inserir, selecione HTML, clique no botão Caracteres e selecione a opção Espaço não separável.
Defina uma preferência para adicionar espaços não separáveis.
-
Selecione Editar > Preferências (Windows) ou Dreamweaver > Preferências (Macintosh).
-
Na categoria geral, verifique se a opção Permitir vários espaços consecutivos está marcada.
Adicionar espaçamento do parágrafo
O Dreamweaver funciona da mesma forma que muitos aplicativos de processamento de texto: pressione Enter (Windows) ou Return (Macintosh) para criar um novo parágrafo. Os navegadores da Web inserem automaticamente um linha de espaço em branco entre os parágrafos. Você pode adicionar uma única linha de espaço entre os parágrafos inserindo uma quebra de linha.
Adicionar um retorno de parágrafo
-
Pressione Enter (Windows) ou Return (Macintosh).
Adição de uma quebra de linha
-
Siga um destes procedimentos:
Pressione Shift+Enter (Windows) ou Shift+Return (Macintosh).
Selecione Inserir > HTML > Caracteres especiais > Quebra de linha.
Do painel Inserir, selecione HTML, clique no botão Caracteres e selecione Quebra de linha.
Criar listas numeradas e com marcadores
Você pode criar listas numeradas (ordenadas), listas com marcadores (não ordenadas) e listas de definições a partir de um texto existente ou de um texto novo enquanto digita na janela Documento.
As listas de definições não usam caracteres à esquerda, como pontos de marcador ou números, e geralmente são usadas em glossários ou descrições. As listas também podem ser aninhadas. As listas aninhadas contêm outras listas. Por exemplo, você provavelmente precisará de uma lista ordenada ou com marcadores aninhada dentro de outra lista numerada ou ordenada.
Use a caixa de diálogo Propriedades da lista para definir a aparência de uma lista inteira ou de um item de lista individual. Você pode definir um estilo de número, redefinir a numeração ou definir opções de estilo de marcador para itens de lista individuais ou para uma lista inteira.
Criar uma lista
-
No documento do Dreamweaver, coloque o ponto de inserção onde deseja adicionar uma lista e siga um destes procedimentos:
No Inspetor de propriedades HTML, clique no botão Lista ordenada ou Item de lista.
Selecione Inserir > HTML e selecione o tipo de lista desejado: Lista não ordenada (com marcadores), Lista ordenada (numerada).
O caractere à esquerda do item de lista especificado aparece na janela Documento.
-
Digite o texto do item de lista e pressione Enter (Windows) ou Return (Macintosh) para criar outro item de lista.
-
Para concluir a lista, pressione Enter duas vezes (Windows) ou pressione Return duas vezes (Macintosh).
Criar uma lista usando um texto existente
-
Selecione uma série de parágrafos para transformar em uma lista.
-
Selecione Inserir > HTML > Lista não ordenada, Lista ordenada ou Item de lista.
Criar uma lista aninhada
-
Selecione os itens de lista que você deseja aninhar.
-
Clique com o botão direito do mouse e selecione Lista > Recuar.
O Dreamweaver recua o texto e cria uma lista separada com os atributos HTML da lista original.
-
Aplique um novo estilo ou tipo de lista ao texto recuado seguindo o mesmo procedimento usado acima.
Definir propriedades de uma lista inteira
-
Na janela Documento, crie pelo menos um item de lista. O novo estilo será aplicado automaticamente aos itens extras que você adicionar à lista.
-
Com o ponto de inserção no texto do item de lista, clique com o botão direito e selecione Lista > Propriedades. O sistema exibe a caixa de diálogo Propriedades da lista.
-
Escolha as opções desejadas para definir a lista:
Tipo de lista
Especifica as propriedades de lista, enquanto Item de lista especifica um item individual em uma lista. Use o menu pop‑up para selecionar uma lista com marcadores, numerada, de diretórios ou de menus. Dependendo do Tipo de lista selecionado, diferentes opções aparecerão na caixa de diálogo.
Estilo
Determina o estilo de números ou marcadores usados em uma lista numerada ou com marcadores. Todos os itens da lista terão esse estilo, a menos que você especifique um novo estilo para os itens na lista.
Iniciar contagem
Define o valor do primeiro item em uma lista numerada.
-
Clique em OK para definir as opções.
Definição das propriedades de lista de um item de lista
-
Na janela Documento, coloque o ponto de inserção no texto de um item de lista que você deseja afetar.
-
Clique com o botão direito e selecione Lista > Propriedades.
-
Em Item de lista, defina as opções que deseja definir:
Novo estilo
Especifica um estilo para o item de lista selecionado. Os estilos no menu Novo estilo são relacionados ao tipo de lista exibido no menu Tipo de lista. Por exemplo, se o menu Item de lista exibir Lista com marcadores, somente as opções de marcador estarão disponíveis no menu Novo estilo.
Redefinir contagem para
Define um número específico a partir do qual as entradas de item de lista serão numeradas.
-
Clique em OK para definir as opções.
Procura e substituição de texto
Para obter mais informações sobre como localizar e substituir texto, consulte Localizar e substituir texto.
Definir abreviações e acrônimos
O HTML fornece tags que permitem definir as abreviações e os acrônimos usados na página para mecanismos de pesquisa, verificadores ortográficos, programas de conversão de idioma ou sintetizadores de fala. Por exemplo, talvez seja necessário especificar que a abreviação EM na página significa engenharia mecânica ou que o acrônimo WHO significa World Health Organization.
-
Selecione a abreviação ou o acrônimo no texto da página.
-
Selecione Inserir > HTML > Objetos de texto > Abreviação ou Inserir > HTML > Objetos de texto > Acrônimo.
-
Digite o texto completo do acrônimo ou da abreviação.
-
Digite o idioma, como en para inglês, de para alemão ou it para italiano.
Definição das preferências de cópia e colagem
Você pode definir preferências de colagem especial como opções padrão ao usar Editar > Colar para colar texto de outros aplicativos. Por exemplo, se você deseja colar o texto sempre como apenas texto ou texto com formatação básica, defina a opção padrão na caixa de diálogo Preferências de cópia/colagem.
Quando você colar texto em um documento do Dreamweaver, use o comando Colar ou Colar especial. O comando Colar especial permite especificar o formato do texto colado de diferentes formas. Por exemplo, se você deseja colar texto de um documento formatado do Microsoft Word no documento do Dreamweaver, mas deseja retirar toda a formatação para que possa aplicar sua própria folha de estilos CSS ao texto colado, selecione texto no Word, copie-o para a área de transferência e use o comando Colar especial para selecionar a opção que permite colar apenas texto.
As preferências definidas na caixa de diálogo Preferências de cópia/colagem se aplicam apenas ao material colado na Visualização de design.
-
Selecione Editar > Preferências (Windows) ou Dreamweaver > Preferências (Macintosh).
-
Clique na categoria Copiar/colar.
-
Defina as opções a seguir e clique em OK.
Apenas texto
Permite que você cole texto sem formatação. Se o texto original estiver formatado, toda a formatação, incluindo quebras de linha e parágrafos, será removida.
Texto com estrutura
Permite colar um texto que retenha a estrutura, mas não retenha a formatação básica. Por exemplo, você pode colar o texto e manter a estrutura de parágrafos, listas e tabelas, sem manter o negrito, o itálico e outras formatações.
Texto com estrutura e formatação básica
Permite colar um texto HTML estruturado e simples (por exemplo, parágrafos e tabelas, assim como um texto formatado com a tag b, i, u, strong, em, hr, abbr ou acronym).
Texto com estrutura e formatação integral
Permite colar um texto que retenha a estrutura, a formatação HTML e os estilos CSS.
Observação:A opção Formatação integral não pode reter estilos CSS provenientes de uma folha de estilos externa nem reter estilos caso o aplicativo do qual você esteja colando os dados não retenha estilos após a colagem para a área de transferência.
Reter quebras de linha
Permite manter quebras de linha no texto colado. Esta opção estará desativada se você tiver selecionado Apenas texto.
Limpar espaçamento de parágrafo do Word
Selecione esta opção se tiver selecionado Texto com estrutura ou Texto com estrutura e formatação básica, e deseje eliminar espaço extra entre parágrafos ao colar o texto.
Converter aspas inglesas em aspas retas converte aspas inglesas em aspas retas.