Aprenda como recolher e expandir o código no Dreamweaver para exibir seções do seu documento sem usar a barra de rolagem.

Você pode recolher (ou dobrar) e expandir fragmentos de código para exibir diferentes seções do documento sem precisar usar a barra de rolagem.

Por exemplo, para ver todas as regras CSS na tag head que se aplicam a uma tag div mais abaixo na página, você pode dobrar todo o código entre a tag head e a tag div para ver as duas seções de código ao mesmo tempo.

Você pode selecionar uma parte do código para recolhê-la. Também é possível recolher código em arquivos HTML, PHP, XML e SVG baseados em blocos de tags. Em arquivos CSS, Less, Sass, SCSS e JS, é possível recolher o código baseado em chaves.

  • Arquivos HTML: o Dreamweaver recolhe o código entre uma tag HTML de abertura e uma de finalização, e os atributos iniciais, onde aplicável, são exibidos no código recolhido. O Dreamweaver expande automaticamente quando o código dentro do bloco recebe o foco por meio de Seletor de tags, Localizar e substituir, Ir para linha, Visualização rápida do elemento, Visualização dinâmica ou Desfazer/refazer.

Quando a seleção nesses recursos muda, o código é recolhido automaticamente.

  • Arquivos CSS, Less, Sass, SCSS e JS: o código entre chaves é recolhido e a visualização é exibida como {...}.
  • Arquivos PHP: além dos blocos de código PHP, os elementos HTML, o CSS e os blocos de código JS são recolhidos. 

Observação:

os arquivos criados com base em modelos do Dreamweaver exibem todo o código como totalmente expandido, mesmo se o arquivo de modelo (.dwt) contiver fragmentos de código recolhidos.

Definição de preferências de tamanho de dobramento do código

O tamanho padrão para dobramento de código é duas linhas. Nesta configuração padrão, quando você recolhe o código, todos os fragmentos que têm pelo menos duas linhas de código são recolhidos. Os fragmentos que têm menos de duas linhas são exibidos no modo expandido.

Para alterar o número mínimo de linhas para dobramento de código:

  1. Clique em Editar > Preferências (no Windows) ou Dreamweaver > Preferências (no Mac).

  2. Clique em Formato do código na lista Categoria e especifique o tamanho mínimo para dobramento de código.

Recolhimento e expansão de fragmentos de código

Por padrão, todo o código na Visualização de código está no modo expandido.

No entanto, você pode recolher o código selecionando várias linhas e recolhendo-as. Você também pode recolher código com base na sintaxe - blocos de tag ou chaves. 

Observação:

o estado recolhido ou expandido dos blocos de código é mantido entre as sessões do Dreamweaver.

Recolher código com base em blocos de tag ou chaves

Para recolher código com base nos blocos de tag ou chaves:

  1. Na Visualização de código, passe o mouse sobre a coluna de número de linha que corresponde ao bloco de código que você deseja recolher ou expandir. Um pequeno triângulo aparece ao lado dos números de linha.

  2. Clique no triângulo para recolher ou expandir o código.

    Observação:

    para expandir todo o código recolhido no documento, você pode usar o atalho de teclado Control+Alt+E (Win) ou Command+Alt+E (Mac).

    Recolher código usando blocos de tag
    Recolher código usando blocos de tag (necessário atualizar o screenshot)

Recolher código com base na seleção

Para recolher código com base na seleção:

  1. Na Visualização de código, selecione o fragmento de código que deseja recolher.

    Quando você seleciona o código, um ícone de recolhimento é exibido na coluna de número de linha.

  2. Clique no ícone para recolher e expandir a seleção.

    Quando o código é recolhido, o ícone de recolhimento muda para um ícone de expansão (). 

    Recolher código selecionado
    Recolher o código selecionado (necessário atualizar o screenshot)

    Expandir o código (necessário atualizar o screenshot)
    Expandir o código (necessário atualizar o screenshot)

Usar atalhos de teclado para recolher e expandir código

Comando

Windows

Macintosh

Recolher seleção

Control+Shift+C

Command+Shift+C

Recolher seleção expandida

Control+Alt+C

Command+Alt+C

Expandir seleção

Control+Shift+E

Command+Shift+E

Recolher tag completa

Control+Shift+J

Command+Shift+J

Recolher tag completa expandida

Control+Alt+J

Command+Alt+J

Expandir tudo

Control+Alt+E

Command+Alt+E

Copiar e colar um fragmento de código recolhido

  1. Clique no fragmento de código recolhido para selecioná-lo.

  2. Selecione Editar > Copiar.
  3. Coloque o cursor no local em que você deseja colar o código.

  4. Selecione Editar > Colar.

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