Observação:

a interface de usuário foi simplificada no Dreamweaver CC e posterior. Como resultado, você talvez não consiga localizar algumas das opções descritas neste artigo no Dreamweaver CC e posterior. Para obter mais informações, consulte este artigo (em inglês).

Como funcionam os quadros e os conjuntos de quadros

Um quadro é uma região de uma janela do navegador que pode exibir um documento HTML independentemente do que está sendo exibido no restante da janela do navegador. Os quadros permitem dividir uma janela do navegador em várias regiões, cada uma delas podendo exibir um documento HTML diferente. Geralmente, um quadro exibe um documento que contém controles de navegação, enquanto outro quadro exibe um documento com o conteúdo.

Um conjunto de quadros é um arquivo HTML que define o layout e as propriedades de um conjunto de quadros, incluindo o número de quadros, o tamanho e o posicionamento dos quadros, e o URL da página que aparece inicialmente em cada quadro. O arquivo de conjunto de quadros propriamente não possui conteúdo HTML a ser exibido em um navegador, a não ser a seção noframes. O arquivo de conjunto de quadros simplesmente fornece informações para o navegador sobre como deve ser a aparência de um conjunto de quadros e quais documentos devem aparecer nele.

Para ver um conjunto de quadros em um navegador, digite o URL do arquivo do conjunto de quadros. O navegador abrirá os documentos relevantes a serem exibidos nos quadros. O arquivo do conjunto de quadros de um site é geralmente chamado de index.html, a fim de que ele seja exibido por padrão caso um visitante não especifique um nome de arquivo.

O exemplo a seguir mostra um layout de quadro composto por três quadros: um quadro estreito no lado que contém uma barra de navegação, um quadro ao longo da parte superior contendo o logotipo e o título do site, e um quadro grande que ocupa o restante da página e possui o conteúdo principal. Cada um desses quadros exibe um documento HTML separado.

Layout de quadro
Layout de quadro

Neste exemplo, o documento exibido no quadro superior nunca é alterado quando o visitante navega no site. A barra de navegação de quadro lateral contém links; se você clicar em um desses links, o conteúdo do quadro principal é alterado, mas o conteúdo do quadro lateral permanece estático. O quadro de conteúdo principal à direita exibe o documento apropriado para o link que o visitante clica à esquerda.

Um quadro não é um arquivo. É fácil considerar o documento que aparece atualmente em um quadro como parte integrante do quadro, mas, na verdade, o documento não faz parte do quadro. O quadro é um contêiner que retém o documento.

Observação:

uma “página” se refere a um único documento HTML ou ao conteúdo inteiro de uma janela de documento em um dado momento, mesmo que vários documentos HTML apareçam simultaneamente. A frase “uma página que usa quadros”, por exemplo, geralmente se refere a um conjunto de quadros e aos documento que aparecem inicialmente nesses quadros.

Um site que aparece em um navegador como uma página única composta de três quadros consiste, na verdade, de pelo menos quatro documentos HTML: o arquivo de conjunto de quadros mais os três documentos que possuem o conteúdo que aparece inicialmente nos quadros. Quando você projeta uma página usando conjuntos de quadros no Dreamweaver, deve salvar cada um desses quatro arquivos para que a página funcione corretamente no navegador.

Decidir se os quadros devem ou não ser usados

A Adobe não recomenda o uso de quadros para layout de página da Web. Algumas das desvantagens do uso de quadros incluem:

  • O alinhamento gráfico preciso dos elementos em quadros diferentes podem ser difícil.

  • O teste da navegação pode ser demorado.

  • Os URLs das páginas individuais com quadro não aparecem nos navegadores; portanto, pode ser difícil para um visitante indicar uma página específica (a menos que você forneça um código de servidor que os permita carregar uma versão com quadro de uma página).

Para obter informações completas com os motivos pelos quais você não deve usar quadros, consulte a explicação de Gary White em http://apptools.com/rants/framesevil.php.

Os quadros são mais utilizados para navegação, caso decida usá-los. Um conjunto de quadros geralmente inclui um quadro que contém uma barra de navegação e outro quadro para exibir as páginas de conteúdo principais. Usar os quadros desse modo tem algumas vantagens:

  • O navegador de um visitante não precisa recarregar os gráficos relacionados a navegação em cada página.

  • Cada quadro tem sua própria barra de rolagem (se o conteúdo for muito grande para caber em uma janela), portanto, um visitante pode rolar os quadros de forma independente. Por exemplo, um visitante que rola para a parte inferior de uma página de conteúdo longa em um quadro não precisa rolar novamente para a parte superior a fim de usar a barra de navegação, caso ela esteja em outro quadro.

Em muitos casos, é possível criar uma página da Web sem quadros que atinja os mesmos objetivos de um conjunto de quadros. Por exemplo, se você deseja que uma barra de navegação apareça no lado esquerdo da página, substitua a página por um conjunto de quadros ou apenas inclua a barra de navegação em cada página do site. (O Dreamweaver ajuda você a criar várias páginas que usam o mesmo layout.) O exemplo a seguir mostra um design de página com um layout semelhante ao de um quadro, mas que não usa quadros.

Layout semelhante ao de um quadro sem quadros
Um layout semelhante ao de um quadro sem quadros

Os sites criados de modo inadequado usam quadros desnecessariamente, com um conjunto de quadros que recarrega o conteúdo dos quadros de navegação cada vez que o visitante clica em um botão de navegação. Quando os quadros são bem utilizados (por exemplo, para manter os controles de navegação estáticos em um quadro e, ao mesmo tempo, permitir que o conteúdo de outro quadro seja alterado), eles podem ser muito úteis para um site.

Nem todos os navegadores oferecem um suporte satisfatório aos quadros, dificultando o uso dos quadros pelos visitantes com dificuldades de navegação. Portanto, se você usar quadros, sempre forneça uma seção noframes no conjunto de quadros para os visitantes que não podem visualizá-los. Você também poderia fornecer um link explícito para uma versão sem quadros do site.

Conjuntos de quadros aninhados

Um conjunto de quadros dentro de outro conjunto de quadros é chamado de conjunto de quadros aninhado. Um arquivo de conjunto de quadro pode conter vários conjuntos de quadros aninhados. A maioria das páginas da Web que usa quadros está, na verdade, usando quadros aninhados, e a maioria dos conjuntos de quadros predefinidos no Dreamweaver também usa o aninhamento. Qualquer conjunto de quadros em que haja diferentes números de quadros em diferentes linhas ou colunas requer um conjunto de quadros aninhado.

Por exemplo, o layout de quadro mais comum tem um quadro na linha superior (onde aparece o logotipo da empresa) e dois quadros na linha inferior (um quadro de navegação e um quadro de conteúdo). Esse layout requer um conjunto de quadros aninhado: um conjunto de quadros de duas linhas, com um conjunto de quadros de duas colunas aninhado na segunda linha.

Um conjuntos de quadros aninhados
Um conjuntos de quadros aninhados

A. Conjunto de quadros principal B. O quadro de menu e o quadro de conteúdo estão aninhados dentro do conjunto de quadros principal. 

O Dreamweaver cuida do aninhamento de conjunto de quadros quando necessário. Se você usar as ferramentas de divisão de quadros do Dreamweaver, não precisará se preocupar com quais quadros estão aninhados e quais não estão.

Há duas maneiras de aninhar conjuntos de quadros em HTML: o conjunto de quadros interno pode ser definido no mesmo arquivo que o conjunto de quadros externo ou em um arquivo separado. Cada conjunto de quadros predefinido do Dreamweaver define todos os seus conjuntos de quadros no mesmo arquivo.

Os dois tipos de aninhamento produzem os mesmos resultados visuais; não é fácil dizer, sem examinar o código, qual tipo de aninhamento está sendo usado. A situação mais provável em que um arquivo de conjunto de quadros externo precisará ser usado no Dreamweaver é quando você utiliza o comando Abrir no quadro para abrir um arquivo de conjunto de quadros dentro de um quadro. Isso possivelmente resultará em problemas na definição de alvos para links. É geralmente mais simples manter todos os conjuntos de quadros definidos em um único arquivo.

Trabalhar com conjuntos de quadros na janela Documento

O Dreamweaver permite que você exiba e edite todos os documentos associados a um conjunto de quadros em uma janela Documento. Com essa abordagem, será possível ver aproximadamente como as páginas com quadros aparecerão em um navegador enquanto você as edita. No entanto, alguns aspectos dessa abordagem pode ser confusa até que você se acostume com elas. Em particular, cada quadro exibe um documento HTML separado. Mesmo se os documentos estiverem vazios, você deverá salvá-los para visualizá-los (pois o conjunto de quadros só poderá ser visualizado com precisão se contiver o URL de um documento a ser exibido em cada quadro).

Para garantir que o conjunto de quadros aparecerá corretamente nos navegadores, siga estas etapas gerais:

  1. Crie o conjunto de quadros e especifique um documento para que ele apareça em cada quadro.
  2. Salve cada arquivo que aparecerá em um quadro. Lembre-se de que cada quadro exibe um documento HTML separado e que você deve salvar cada documento, juntamente com o arquivo de conjunto de quadros.
  3. Defina as propriedades de cada quadro e do conjunto de quadros (incluindo a nomeação de cada quadro, a definição das opções de rolagem e não rolagem).
  4. Defina a propriedade Alvo no Inspetor de propriedades para todos os links, a fim de que o conteúdo vinculado apareça na área correta.

Criar quadros e conjuntos de quadros

Há duas maneiras de criar um conjunto de quadros no Dreamweaver: você pode selecionar entre vários conjuntos de quadros predefinidos ou pode criá-lo por sua própria conta.

A escolha de um conjunto de quadros predefinido configura todos os quadros e conjuntos de quadros necessários para criar o layout e é a maneira mais fácil de criar rapidamente um layout baseado em quadro. Você pode inserir um conjunto de quadros predefinido somente na Visualização de design da janela Documento.

Também é possível criar seu próprio conjunto de quadros no Dreamweaver adicionando “divisores” à janela Documento.

Observação:

Antes de criar um conjunto de quadros ou trabalhar com quadros, torne as bordas do quadro visíveis na Visualização de design da janela Documento selecionando Exibir > Auxílios visuais > Bordas de quadro.

Criar um conjunto de quadros predefinido e exibir um documento existente em um quadro

  1. Posicione o ponto de inserção em um documento e siga um destes procedimentos:
    • Escolha Inserir > HTML > Quadros e selecione um conjunto de quadros predefinido.

    • Na categoria Layout do painel Inserir, clique na seta suspensa no botão Quadros e selecione um conjunto de quadros predefinido.

      Os ícones de conjunto de quadros oferecem uma representação visual de cada conjunto de quadros conforme aplicados ao documento atual. A área azul de um ícone de conjunto de quadros representa o documento atual e as áreas brancas representam os quadros que exibirão outros documentos.

  2. Se você tiver configurado o Dreamweaver para solicitar atributos de acessibilidade de quadro, selecione um quadro no menu pop-up, digite um nome para o quadro e clique em OK. (Para os visitantes que usam leitores de tela, o leitor de tela lerá esse nome quando encontrar o quadro em uma página.)

    Observação:

    se você clicar em OK sem digitar um novo nome, o Dreamweaver atribuirá ao quadro um nome que corresponda à sua posição (quadro esquerdo, quadro direito etc.) no conjunto de quadros.

    Observação:

    se você pressionar Cancelar, o conjunto de quadros aparecerá no documento, mas o Dreamweaver não associará tags ou atributos de acessibilidade a ele.

    Observação:

    Selecione Janela > Quadros para exibir um diagrama dos quadros que você está nomeando.

Criar um conjunto de quadros predefinido vazio

  1. Selecione Arquivo > Novo.
  2. Na caixa de diálogo Novo documento, selecione a categoria Página da amostra.
  3. Selecione a pasta Conjunto de quadros na coluna Pasta de amostra.
  4. Selecione um conjunto de quadros na coluna Página de amostra e clique em Criar.
  5. Se você tiver ativado os atributos de acessibilidade de quadro em Preferências, a caixa de diálogo Atributos de acesso a tag frame aparecerá. Preencha a caixa de diálogo de cada quadro e clique em OK.

    Observação:

    se você pressionar Cancelar, o conjunto de quadros aparecerá no documento, mas o Dreamweaver não associará tags ou atributos de acessibilidade a ele.

Criar um conjunto de quadros

  1. Selecione Modificar > Conjunto de quadros e, em seguida, selecione um item de divisão (como Dividir quadro à esquerda ou Dividir quadro à direita) no submenu.

    O Dreamweaver divide a janela em quadros. Se houver um documento aberto, ele aparecerá em um dos quadros.

Dividir um quadro em quadros menores

  • Para dividir o quadro onde está o ponto de inserção, selecione um item de divisão no submenu Modificar > Conjunto de quadros.
    • Para dividir um quadro ou conjunto de quadros vertical ou horizontalmente, arraste uma borda de quadro da borda para o meio da Visualização de design.

    • Para dividir um quadro usando uma borda de quadro que não esteja na borda da Visualização de design, mantenha pressionada a tecla Alt (Windows) ou mantenha pressionada a tecla Option (Macintosh) enquanto arrasta uma borda de quadro.

    • Para dividir um quadro em quatro, arraste uma borda de quadro de um dos cantos da Visualização de design para o meio de um quadro.

Observação:

Para criar três quadros, comece com dois quadros e divida um deles. Não é fácil mesclar dois quadros adjacentes sem editar o código do conjunto de quadros. Portanto, transformar quatro quadros em três é mais difícil do que transformar dois quadros em três.

Excluir um quadro

  1. Arraste uma borda de quadro para fora da página ou para uma borda do quadro pai.

    Se houver algum conteúdo não salvo de um documento em um quadro que está sendo removido, o Dreamweaver solicitará que você salve o documento.

    Observação:

    não é possível remover totalmente um conjunto de quadros arrastando as bordas. Para remover um conjunto de quadros, feche a janela Documento que o exibe. Se o arquivo de conjunto de quadros tiver sido salvo, exclua o arquivo.

Redimensionar um quadro

  • Para definir tamanhos aproximados de quadros, arraste as bordas de quadro na Visualização de design da janela Documento.
  • Para especificar tamanhos exatos e a quantidade de espaço que o navegador alocará para uma linha ou coluna de quadros quando o tamanho da janela do navegador não permitir que os quadros sejam exibidos em tamanho integral, use o Inspetor de propriedades.

Selecionar quadros e conjuntos de quadros

Para alterar as propriedades de um quadro ou conjunto de quadros, comece selecionando o quadro ou conjunto de quadros a ser alterado. Você pode selecionar um quadro ou conjunto de quadros na janela Documento ou usando o painel Molduras.

O painel Molduras oferece uma representação visual dos quadros em um conjunto de quadros. Ele mostra a hierarquia da estrutura do conjunto de quadros de uma maneira que pode não ser visível na janela Documento. No painel Molduras, uma borda muito espessa envolve cada conjunto de quadros; cada quadro é contornado por uma linha cinza fina e é identificado por um nome de quadro.

Painel Molduras
Painel Molduras

Na Visualização de design da janela Documento, quando um quadro é selecionado, suas bordas são contornadas com uma linha pontilhada. Quando um conjunto de quadros é selecionado, todas as bordas dos quadros do conjunto de quadros são contornadas com uma linha pontilhada clara.

Observação:

o posicionamento do ponto de inserção em um documento exibido em um quadro não é o mesmo que selecionar um quadro. Há várias operações (como definir as propriedades do quadro) nas quais você deve selecionar um quadro.

Selecionar um quadro ou conjunto de quadros no painel Molduras

  1. Selecione Janela > Quadros.
  2. No painel Molduras:
    • Para selecionar um quadro, clique no quadro. (Um contorno de seleção aparece em torno do quadro no painel Molduras e na Visualização de design da janela Documento.)

    • Para selecionar um conjunto de quadros, clique na borda que envolve o conjunto de quadros.

Selecionar um quadro ou conjunto de quadros na janela Documento

  • Para selecionar um quadro, clique com as teclas Shift e Alt (Windows) ou Option e Shift (Macintosh) pressionadas em um quadro na Visualização de design.
  • Para selecionar um conjunto de quadros, clique em uma das bordas de quadro internas do conjunto de quadros na Visualização de design. (As bordas de quadro devem estar visíveis para que isso possa ser feito. Selecione Exibir > Auxílios visuais > Bordas de quadro para tornar as bordas visíveis, caso elas não estejam.)

Observação:

é geralmente mais fácil selecionar conjuntos de quadros no painel Molduras do que na janela Documento. Para obter mais informações, consulte os tópicos anteriores.

Selecionar outro quadro ou conjunto de quadros

  • Para selecionar o quadro ou conjunto de quadros seguinte ou anterior no mesmo nível hierárquico da seleção atual, pressione Alt+Seta à esquerda ou Alt+Seta à direita (Windows) ou Command+Seta à esquerda ou Command+Seta à direita (Macintosh). Usando essas teclas, você pode percorrer os quadros e conjuntos de quadros na ordem em que estão definidos no arquivo de conjunto de quadros.
  • Para selecionar o conjunto de quadros pai (o conjunto de quadros que contém a seleção atual), pressione Alt+Seta para cima (Windows) ou Command+Seta para cima (Macintosh).
  • Para selecionar o primeiro quadro ou conjunto de quadros filho do conjunto de quadros selecionado (ou seja, o primeiro na ordem em que eles estão definidos no arquivo de conjunto de quadros), pressione Alt+Seta para baixo (Windows) ou Command+Seta para baixo (Macintosh).

Abrir um documento em um quadro

Você pode especificar o conteúdo inicial de um quadro inserindo o novo conteúdo em um documento vazio em um quadro ou abrindo um documento existente em um quadro.

  1. Coloque o ponto de inserção em um quadro.
  2. Selecione Arquivo > Abrir no quadro.
  3. Selecione um documento a ser aberto no quadro e clique em OK (Windows) ou Escolher (Macintosh).
  4. (Opcional) Para tornar este documento o padrão a ser exibido no quadro quando o conjunto de quadros é aberto em um navegador, salve o conjunto de quadros.

Salvar arquivos de quadro e conjunto de quadros

Para que você possa visualizar um conjunto de quadros em um navegador, salve o arquivo de conjunto de quadros e todos os documentos a serem exibidos nos quadros. Você pode salvar cada arquivo de conjunto de quadros e um documento com quadro ou salvar o arquivo de conjunto de quadros e todos os documentos que aparecem nos quadros simultaneamente.

Observação:

quando você usa as ferramentas visuais do Dreamweaver para criar um conjunto de quadros, cada novo documento exibido em um quadro recebe um nome de arquivo padrão. Por exemplo, o primeiro arquivo de conjunto de quadros é nomeado como ConjuntodequadrosSemTítulo‑1, enquanto o primeiro documento de um quadro é nomeado como QuadroSemTítulo‑1.

Salvar um arquivo de conjunto de quadros

  1. Selecione o conjunto de quadros no painel Molduras ou na janela Documento.
    • Para salvar o arquivo de conjunto de quadros, selecione Arquivo > Salvar conjunto de quadros.

    • Para salvar o arquivo de conjunto de quadros como um novo arquivo, selecione Arquivo > Salvar conjunto de quadros como.

    Observação:

    se o arquivo de conjunto de quadros não tiver sido salvo, esses dois comandos serão equivalentes.

Salvar um documento que aparece em um quadro

  1. Clique no quadro, selecione Arquivo > Salvar quadro ou Arquivo > Salvar quadro como.

Salvar todos os arquivos associados a um conjunto de quadros

  1. Selecione Arquivo > Salvar todos os quadros.

    Esse procedimento salva todos os documentos abertos no conjunto de quadros, incluindo o arquivo de conjunto de quadros e todos os documentos com quadro. Se o arquivo de conjunto de quadros ainda não tiver sido salvo, uma borda espessa aparecerá em torno do conjunto de quadros (ou o quadro não salvo) na Visualização de design e você poderá selecionar um nome de arquivo.

    Observação:

    se você usou Arquivo > Abrir no quadro para abrir um documento no quadro, ao salvar o conjunto de quadros, o documento que você abriu no quadro se tornará o documento padrão a ser exibido nesse quadro. Caso não queira que o documento seja o padrão, não salve o arquivo de conjunto de quadros.

Exibir e definir propriedades e atributos de quadro

Use o Inspetor de propriedades para exibir e definir a maioria das propriedades de quadro, incluindo bordas, margens e informações que especifiquem se as barras de rolagem aparecerão nos quadros. Se você definir uma propriedade de quadro, a configuração dessa propriedade será substituída em um conjunto de quadros.

Talvez você também precise definir alguns atributos de quadro, como o atributo de título (que não é o mesmo que o atributo de nome), para melhorar a acessibilidade. Você pode ativar a opção de criação de acessibilidade para quadros a fim de definir atributos ao criar quadros ou pode definir atributos após inserir um quadro. Para editar atributos de acessibilidade para um quadro, use o Inspetor de tags para editar diretamente o código HTML.

Exibir ou definir propriedades de quadro

  1. Selecione um quadro seguindo um destes procedimentos:
    • Clique pressionando a tecla Alt (Windows) ou Shift e Option (Macintosh) em um quadro na Visualização de design da janela Documento.

    • Clique em um quadro no painel Molduras (Janela > Quadros).

  2. No Inspetor de propriedades (Janela > Propriedades), clique na seta de expansão, no canto inferior direito, para exibir todas as propriedades de quadro.
  3. Defina as opções do Inspetor de propriedades de quadro.

    Moldura

    O nome usado pelo atributo target de um link ou por um script para fazer referência ao quadro. Um nome de quadro deve ser uma única palavra. São permitidos sublinhados (_), mas não são permitidos hífens (‑), pontos (.) e espaços. Um nome de quadro deve iniciar com uma letra (e não com números). Os nomes de quadro diferenciam minúsculas de maiúsculas. Não use termos que são palavras reservadas em JavaScript (por exemplo, top ou navigator) como nomes de quadro.

    Observação:

    Para fazer com que um link altere o conteúdo de outro quadro, você deve atribuir um nome ao quadro de destino. Para facilitar a criação de links entre quadros posteriormente, atribua nomes a cada quadro ao criá-los.

    Origem

    Especifica o documento de origem a ser exibido no quadro. Clique no ícone de pasta desejado e selecione um arquivo.

    Rolar

    Especifica se as barras de rolagem aparecem no quadro. Se você definir esta opção como Padrão, um valor não será definido para o atributo correspondente, permitindo que cada navegador use seu valor padrão. A maioria dos navegadores assume Automático como valor padrão, o que significa que as barras de rolagem aparecerão apenas quando não houver espaço suficiente em uma janela de navegador para exibir o conteúdo completo do quadro atual.

    Sem redimensionamento

    Impede que os visitantes arrastem as bordas de quadro para redimensionar o quadro em um navegador.

    Observação:

    você sempre poderá redimensionar os quadros no Dreamweaver; esta opção se aplica apenas aos visitantes que exibem os quadros em um navegador.

    Bordas

    Mostra ou oculta as bordas do quadro atual quando ele é visualizado em um navegador. A seleção da opção Bordas em um quadro substitui as configurações de borda do conjunto de quadros.

    As opções de borda são Sim (mostrar bordas), Não (ocultar bordas) e Padrão. A maioria dos navegadores mostra as bordas, por padrão, a menos que o conjunto de quadros pai esteja com as opções de borda definidas para Não. Uma borda fica oculta somente quando todos os quadros que compartilham a borda estão com as opções de borda definidas para Não, ou quando a propriedade de bordas do conjunto de quadros pai está definida para Não e os quadros que compartilham a borda estão com as opções de borda definidas para Padrão.

    Cor da borda

    Define uma cor para todas as bordas do quadro. Esta cor se aplica a todas as bordas que tocam o quadro e substitui a cor de borda especificada do conjunto de quadros.

    Largura da margem

    Define a largura em pixels das margens esquerda e direita (o espaço entre as bordas de quadro e o conteúdo).

    Altura da margem

    Define a altura em pixels das margens superior e inferior (o espaço entre as bordas de quadro e o conteúdo).

    Observação:

    definir a largura e altura da margem de um quadro não é o mesmo que definir margens na caixa de diálogo Modificar > Propriedades da página.

    Observação:

    Para alterar a cor de fundo de um quadro, defina a cor de fundo do documento no quadro, nas propriedades da página.

Definir valores de acessibilidade de um quadro

  1. No painel Molduras (Janela > Quadros), selecione um quadro colocando o ponto de inserção em um dos quadros.
  2. Selecione Modificar > Editar tag <frameset>.
  3. Selecione Folha de estilos/acessibilidade na lista de categorias à esquerda, digite os valores e clique em OK.

Editar valores de acessibilidade de um quadro

  1. Exiba a Visualização de código ou as visualizações de código e de design do documento, se você estiver na Visualização de design.
  2. No painel Molduras (Janela > Quadros), selecione um quadro colocando o ponto de inserção em um dos quadros. O Dreamweaver realça a tag frame no código.
  3. Clique com o botão direito do mouse no código (Windows) ou mantenha pressionada a tecla Control enquanto clica no código (Macintosh) e selecione Editar tag.
  4. No editor de tags, faça as alterações e clique em OK.

Alterar a cor de fundo de um documento em um quadro

  1. Coloque o ponto de inserção no quadro.
  2. Selecione Modificar > Propriedades da página.
  3. Na caixa de diálogo Propriedades da página, clique no menu Cor do fundo e selecione uma cor.

Exibir e definir propriedades do conjunto de quadros

Use o Inspetor de propriedades para exibir e definir a maioria das propriedades do conjunto de propriedades, incluindo o título do conjunto de quadros, as bordas e os tamanhos de quadro.

Definir um título para um documento de conjunto de quadros

  1. Selecione um conjunto de quadros seguindo um destes procedimentos:
    • Clique em uma borda entre dois quadros do conjunto de quadros na Visualização de design da janela Documento.

    • Clique na borda que envolve um conjunto de quadros no painel Molduras (Janela > Quadros).

  2. Na caixa Título da barra de ferramentas Documento, digite um nome para o documento de conjunto de quadros.

    Quando um visitante visualiza o conjunto de quadros em um navegador, o título aparece na barra de título do navegador.

Exibir ou definir propriedades de conjunto de quadros

  1. Selecione um conjunto de quadros seguindo um destes procedimentos:
    • Clique em uma borda entre dois quadros do conjunto de quadros na Visualização de design da janela Documento.

    • Clique na borda que envolve um conjunto de quadros no painel Molduras (Janela > Quadros).

  2. No Inspetor de propriedades (Janela > Propriedades), clique na seta de expansão no canto inferior direito e defina as opções de conjunto de quadros.

    Bordas

    Determina se as bordas devem aparecer em torno dos quadros quando o documento é visualizado em um navegador. Para exibir bordas, selecione Sim. Para impedir que o navegador exiba as bordas, selecione Não. Para que o navegador determine como as bordas serão exibidas, selecione Padrão.

    Largura da borda

    Especifica uma largura para todas as bordas no conjunto de quadros.

    Cor da borda

    Define uma cor para as bordas. Use o seletor de cores para selecionar uma cor ou digite o valor hexadecimal de uma cor.

    Seleção de lin./col.

    Define os tamanhos de quadro para as linhas e colunas do conjunto de quadros selecionado. Clique em uma guia no lado esquerdo ou superior da área Seleção de lin./col. e digite uma altura ou largura na caixa de texto Valor.

    Seleção de lin./col.
    Seleção de lin./col.

  3. Para especificar a quantidade de espaço que o navegador alocará para cada quadro, selecione entre as seguintes opções do menu Unidades:

    Pixels

    Define o tamanho da coluna ou linha selecionada para um valor absoluto. Escolha esta opção para um quadro que deve estar sempre no mesmo tamanho, como uma barra de navegação. O espaço dos quadros com tamanhos especificados em pixels é alocado antes dos quadros com tamanhos especificados como um valor percentual ou relativo. A abordagem mais comum para tamanhos de quadro é definir um quadro esquerdo para uma largura de pixel fixa e definir um quadro direito para um valor relativo, o que possibilitará que o quadro direito seja alongado de modo a ocupar todo o espaço restante após a largura de pixel ser alocada.

    Observação:

    se todas as larguras forem especificadas em pixels e um visitante exibir o conjunto de quadros de um navegador que seja muito largo ou estreito para a largura especificada, os quadros serão aumentados ou reduzidos proporcionalmente para preencher o espaço disponível. O mesmo se aplica às alturas especificadas em pixels. Desse modo, geralmente é recomendável especificar pelo menos uma largura ou altura como relativa.

    Percentual

    Especifica que a coluna ou linha selecionada deve ser uma porcentagem da largura ou altura total do conjunto de quadros. O espaço dos quadros com unidades definidas para Percentual é alocado após os quadros com unidades definidas para Pixels, mas antes dos quadros com unidades definidas como Relativo.

    Relativo

    Especifica que a coluna ou linha selecionada deve ser alocada no restante do espaço disponível depois que os quadros definidos como Pixels e Percentual estiverem com seus espaços alocados. Esse espaço restante é dividido proporcionalmente entre os quadros com tamanhos definidos para Relativo.

    Observação:

    quando você seleciona Relativo no menu Unidades, qualquer número digitado no campo Valor desaparecerá. Se você precisar especificar um número, deve digitá-lo novamente. No entanto, se houver apenas uma linha ou coluna definida como Relativo, não será necessário digitar um número, já que a linha ou coluna recebe todo o espaço restante depois que as outras linhas e colunas tem seus espaços alocados. Para ter a certeza da compatibilidade entre navegadores, digite 1 no campo Valor. Isso é o mesmo que não digitar nenhum valor.

Para usar um link em um quadro para abrir um documento em outro quadro, defina um destino para o link. O atributo target de um link especifica o quadro ou a janela em que o conteúdo vinculado é aberto.

Por exemplo, se a barra de navegação estiver no quadro esquerdo e o material vinculado tiver que aparecer no quadro de conteúdo principal à direita, especifique o nome do quadro de conteúdo principal como destino para cada um dos links da barra de navegação. Quando um visitante clica em um link de navegação, o conteúdo especificado é aberto no quadro principal.

  1. Na Visualização de design, selecione um texto ou um objeto.
  2. Na caixa Link no Inspetor de propriedades (Janela > Propriedades), siga um destes procedimentos:
    • Clique no ícone de pasta e selecione o arquivo ao qual você deseja se vincular.

    • Arraste o ícone Apontar para arquivo para o painel Arquivos e selecione o arquivo ao qual você deseja se vincular.

  3. No menu Alvo do Inspetor de propriedades, selecione o quadro ou a janela em que o documento vinculado deve aparecer:
    • _blank abre o documento vinculado em uma nova janela de navegador, deixando a janela atual inalterada.

    • _parent abre o documento vinculado no conjunto de quadros pai do quadro no qual o link aparece, substituindo o conjunto de quadros inteiro.

    • _self abre o link no quadro atual, substituindo o conteúdo nesse quadro.

    • _top abre o documento vinculado na janela de navegador atual, substituindo todos os quadros.

      Os nomes de quadro também aparecem neste menu. Selecione um quadro com nome a fim de abrir o documento vinculado nesse quadro.

    Observação:

    os nomes de quadro só aparecem quando você está editando um documento em um conjunto de quadros. Quando você edita um documento em sua própria janela Documento, os nomes de quadro não aparecem no menu pop-up Alvo. Se você estiver editando um documento fora do conjunto de quadros, poderá digitar o nome do quadro de destino na caixa de texto Alvo.

    Observação:

    Se você estiver se vinculando a uma página fora do site, sempre use target="_top" ou target="_blank" para deixar claro que a página não é parte do site.

Fornecimento de conteúdo para navegadores sem suporte a quadros

O Dreamweaver permite que você especifique que o conteúdo será exibido em navegadores baseados em texto e em navegadores gráficos mais antigos que não oferecem suporte a quadros. Esse conteúdo é armazenado no arquivo de conjunto de quadros, delimitado por uma tag noframes. Quando um navegador que não oferece suporte a quadros carrega o arquivo de conjunto de quadros, o navegador exibe somente o conteúdo delimitado pela tag noframes.

Observação:

o conteúdo na área noframes deve ser mais que uma simples nota informando “Você deve fazer a atualização para um navegador que aceite quadros”. Alguns visitantes de site usam sistemas que não permitem a visualização de quadros.

  1. Selecione Modificar > Conjunto de quadros > Editar conteúdo sem quadros.

    O Dreamweaver limpa a Visualização de design e as palavras “Conteúdo sem quadros” aparecem na parte superior da Visualização de design.

  2. Siga um destes procedimentos:
    • Na janela Documento, digite ou insira o conteúdo como você faria em um documento comum.

    • Selecione Janela > Inspetor de código, coloque o ponto de inserção entre as tags body que aparecem nas tags noframes e digite o código HTML do conteúdo.

  3. Selecione Modificar > Conjunto de quadros > Editar conteúdo sem quadros novamente para retornar à visualização normal do documento de conjunto de quadros.

Usar de comportamentos JavaScript com quadros

Há vários comportamentos JavaScript e comandos relacionados a navegação que são especificamente apropriados para uso com quadros:

Definir texto do quadro

Substitui o conteúdo e a formatação de um determinado quadro com o conteúdo especificado. O conteúdo pode incluir qualquer código HTML válido. Execute esta ação para exibir dinamicamente as informações em um quadro.

Ir para URL

Abre uma nova página na janela atual ou no quadro especificado. Esta ação é especificamente útil para alterar o conteúdo de dois ou mais quadros com um clique.

Inserir menu de salto

Configura uma lista de menus de links que abrem arquivos em uma janela de navegador quando eles são clicados. Você também pode indicar uma janela ou quadro no qual o documento será aberto.

Para obter mais informações, consulte Adicionar comportamentos JavaScript

Esta obra está licenciada sob uma licença não adaptada da Creative Commons Attribution-Noncommercial-Share Alike 3.0  As publicações do Twitter™ e do Facebook não são cobertas pelos termos do Creative Commons.

Avisos legais   |   Política de privacidade online