Use este tópico para saber como usar o Inspetor de propriedades para editar código na Visualização de design no Adobe Dreamweaver.
O Dreamweaver permite criar e editar visualmente páginas da Web sem que você precise se preocupar com o código-fonte subjacente. No entanto, haverá momentos em que provavelmente será necessário editar o código para ter maior controle ou para solucionar problemas da página da Web. O Dreamweaver permite que você edite alguns códigos enquanto trabalha na Visualização de design.
Esta seção foi projetada para pessoas que preferem trabalhar na Visualização de design, mas que também desejam acessar rapidamente o código.
Se você selecionar um objeto na Visualização de design que contém tags-filha, por exemplo, uma tabela HTML, poderá selecionar rapidamente a primeira tag-filha desse objeto clicando em Editar > Selecionar filho.
Esse comando só estará ativado na Visualização de design.
Por exemplo, a tag <table> normalmente tem tags-filha <tr>. Se você selecionar uma tag <table> no seletor de tags, poderá selecionar a primeira linha na tabela clicando em Editar > Selecionar filho. O Dreamweaver selecionará a primeira tag <tr> no seletor de tags. Como a tag <tr> possui tags-filha, chamadas tags <td>, se você clicar novamente em Editar > Selecionar filho, a primeira célula da tabela será selecionada.
Você pode usar o Inspetor de propriedades para inspecionar e editar os atributos de texto ou de objetos na página. As propriedades mostradas no Inspetor de propriedades geralmente correspondem aos atributos das tags. A alteração de uma propriedade no Inspetor de propriedades normalmente tem o mesmo efeito que alterar o atributo correspondente na Visualização de código.
O Inspetor de tags e o Inspetor de propriedades permitem que você exiba e edite os atributos de uma tag. O Inspetor de tags permite que você exiba e edite cada atributo associado a uma tag específica. O Inspetor de propriedades mostra somente os atributos mais comuns, mas fornece um conjunto mais sofisticado de controles para alterar os valores desses atributos, e permite editar determinados objetos (como colunas de tabela) que não correspondem a tags específicas.
O Inspetor de propriedades do texto ou objeto aparece abaixo da janela Documento. Se o Inspetor de propriedades não estiver visível, selecione Janela > Propriedades.
Use o Inspetor de propriedades para inspecionar e modificar o markup do ColdFusion na Visualização de design.
O botão Conteúdo aparecerá somente se a tag selecionada não for uma tag vazia (ou seja, se ela contiver uma tag de abertura e uma tag de finalização).
Use o Quick Tag Editor para inspecionar, inserir e editar rapidamente as tags HTML sem sair da Visualização de design.
Se você digitar um HTML inválido no Quick Tag Editor, o Dreamweaver tentará corrigi-lo para você inserindo aspas de fechamento e colchetes angulares de fechamento quando necessário.
Para definir as opções do Quick Tag Editor, abra o editor pressionando Control-T (Windows) ou Command-T (Macintosh).
O Quick Tag Editor possui três modos:
O modo Inserir HTML é usado para inserir um novo código HTML.
O modo Editar tag é usado para editar uma tag existente.
O modo Colocar tag ao redor é usado para colocar uma nova tag ao redor de uma seleção atual.
O modo em que o Quick Tag Editor é aberto depende da seleção atual na Visualização de design.
Nos três modos, o procedimento básico para uso do Quick Tag Editor é o mesmo: abra o editor, digite ou edite tags e atributos, e feche o editor.
Você pode percorrer os três modos pressionando Control+T (Windows) ou Command+T (Macintosh) enquanto o Quick Tag Editor está ativo.
Use o Quick Tag Editor (Editar > Quick Tag Editor) para inspecionar, inserir e editar rapidamente as tags HTML sem sair da Visualização de design.
O Quick Tag Editor é aberto no modo Inserir HTML.
A tag é inserida no código, juntamente com uma tag de finalização correspondente, se aplicável.
Você também pode selecionar a tag que deseja editar no seletor de tags na parte inferior da janela Documento. Para obter mais informações, consulte Edição de código com o seletor de tags.
O Quick Tag Editor é aberto no modo Editar tag.
Por padrão, as alterações são aplicadas ao documento quando você pressiona Tab ou Shift+Tab.
Se você selecionar texto ou um objeto que inclua uma tag HTML de abertura ou finalização, o Quick Tag Editor será aberto no modo Editar tag, e não no modo Colocar tag ao redor.
O Quick Tag Editor é aberto no modo Colocar tag ao redor.
A tag é inserida no início da seleção atual, enquanto uma tag de finalização correspondente é inserida no final.
O Quick Tag Editor inclui um menu de dicas de atributos que lista todos os atributos válidos da tag que você está editando ou inserindo.
Você também pode desativar o menu de dicas ou ajustar o atraso antes que o menu seja exibido no Quick Tag Editor.
Para ver um menu de dicas que lista os atributos válidos para uma tag, faça uma pausa rápida enquanto edita um nome de atributo no Quick Tag Editor. Um menu de dicas é exibido, listando todos os atributos válidos para a tag que você está editando.
Da mesma forma, para ver um menu de dicas que lista nomes de tag válidos, faça uma pausa enquanto digita ou edita um nome de tag no Quick Tag Editor.
As preferências de dicas de código do Quick Tag Editor são controladas pelas preferências normais de dicas de código. Para obter mais informações, consulte Definição das preferências de dicas de código.
Comece a digitar um nome de tag ou atributo. A seleção no menu Dicas de código vai para o primeiro item que inicia com as letras que você digitou.
Use as teclas para cima ou para baixo a fim de selecionar um item.
Use a barra de rolagem para localizar um item.
A caixa de diálogo Preferências de dicas de código é exibida.
Você pode usar o seletor de tags para selecionar, editar ou remover tags sem sair da Visualização de design. O seletor de tags está localizado na barra de status, na parte inferior da janela Documento, e mostra uma série de tags.
As tags aplicadas no ponto de inserção aparecem no seletor de tags.
As tags aplicadas no ponto de inserção aparecem no seletor de tags.
O objeto representado pela tag é selecionado na página.
Use esta técnica para selecionar linhas (tags tr) ou células (tags td) de tabela individuais.
Você pode trabalhar com JavaScripts e VBScripts do cliente tanto na Visualização de código quanto na Visualização de design, da seguinte maneira:
Grave um script JavaScript ou VBScript para a página sem sair da Visualização de design.
Crie um link no documento para um arquivo de script externo sem sair da Visualização de design.
Edite um script sem sair da Visualização de design.
Antes de iniciar, selecione Exibir > Auxílios visuais > Elementos invisíveis para garantir que os marcadores de script aparecerão na página.
Selecione Inserir > HTML > Script.
Selecione o script na janela de seleção do arquivo.
Não é preciso incluir as tags de script de abertura e finalização.
A tag de script para o arquivo selecionado é inserida no documento.
O script é exibido na caixa de diálogo Propriedades do script.
Se você estiver vinculado a um arquivo de script externo, o arquivo será aberto na Visualização de código, na qual você poderá fazer as edições.
Se houver código entre as tags de script, a caixa de diálogo Propriedades do script será aberta, mesmo se também houver um link para um arquivo de script externo.
Clique no ícone de pasta ou no botão Procurar para selecionar um arquivo ou digite o caminho.
Use o Inspetor de propriedades do script ASP para inspecionar e modificar scripts ASP do servidor na Visualização de design.
Se você estiver usando JavaScript e não tiver certeza da versão, selecione JavaScript em vez de JavaScript1.1 ou JavaScript1.2.
(Opcional) Na caixa Origem, especifique um arquivo de script vinculado externamente. Clique no ícone de pasta para selecionar o arquivo ou digite o caminho.
Você pode anexar facilmente comportamentos JavaScript (no lado do cliente) nos elementos de página, usando a aba Comportamentos do Inspetor de tags. Para obter mais informações, consulte Aplicação de comportamentos internos do JavaScript Dreamweaver.
Fazer logon em sua conta