Encontrando Tags HTML de Fechamento no Sublime Text: Métodos e Plugins
Resumo Rápido
Para encontrar rapidamente as tags no Sublime Text, use o atalho de teclado Ctrl+Shift+A
no Windows ou Cmd+Shift+A
no Mac. Essa ação irá destacar todo o bloco da tag de abertura até a tag de fechamento:
<div>
<!-- Ctrl+Shift+A e todo o seu bloco estará destacado -->
</div>
Outra maneira rápida de localizar a tag de fechamento é através do comando Ir para Par no plugin Emmet, ativado pelo atalho Ctrl+Alt+J
no Windows/Linux ou Shift+Ctrl+T
no Mac. Graças a esse recurso, navegar entre as tags será suave e rápido!
Ferramentas Adicionais: Emmet e Sublime Text
Para uma experiência mais conveniente ao trabalhar com tags HTML no Sublime Text, é altamente recomendável instalar o plugin Emmet. Você pode personalizar os atalhos de teclado para atender às suas necessidades editando o arquivo Emmet.sublime-settings
.
Aventura de Navegação: Movendo Através de Estruturas Aninhadas
No reino das tags aninhadas, sejam elas <script>
ou <style>
, o recurso Ir Para Qualquer Coisa no Sublime Text se mostra muito útil. Para ativá-lo, pressione Control+M
no Windows/Linux ou Cmd+M
no Mac. Pesquise por correspondências e atravesse rapidamente o "labirinto" de tags.
Lidando com Elementos Aninhados Complexos
Ao ordenar uma densa "floresta" de tags, o comando Ctrl+Shift+T
no Windows/Linux ou Cmd+Shift+T
no Mac pode ajudar, pois leva você à última tag de fechamento. Assim, até os ninhos mais profundos se tornam administráveis.
Ferramentas Especiais: Plugins do Sublime Text
Para aqueles que enfrentam não apenas tags, mas também os códigos da "Matrix", existem plugins como o BracketHighlighter que simplificam o manuseio de estruturas HTML complexas. Você pode encontrar e instalar plugins através do gerenciador de pacotes Package Control. Junte-se à comunidade de entusiastas de extensões!
Visualização
Visualize o Sublime Text como a entrada de um labirinto de jardim:
Onde está a tag HTML de fechamento oculta?
O ponto de partida é sua tag de abertura (<div>), que podemos pensar como "o portal para o mundo HTML."
Dê um nó na linha e caminhe através das tags:
🧵 Mova-se pelas tags aninhadas ("<section>, e aqui está <article>!"),
e você definitivamente encontrará a tag de fechamento que lhe dá as boas-vindas com a familiar frase: "Bem-vindo(a) de volta!")
E voilà - você chegou!
🏁 <div> 🌳 <section> 🌳 <article> 🌳 </article> 🌳 </section> 🌳 </div> 🏁
"O portal para o mundo HTML" "Bem-vindo(a) de volta!"
Acelere o processo com a funcionalidade Balance HTML tags
, ativada pelo atalho Ctrl+Alt+A
no Windows/Linux ou Shift+Command+A
no Mac. Um par de tags a serem destacadas aparecerá imediatamente na sua tela!
Para Desenvolvedores Ativos
Confira a documentação do Emmet - ela contém uma riqueza de informações úteis. Se você gosta de trabalhar na linha de comando do Sublime Text, você vai apreciar o poder das expressões regulares e os benefícios da funcionalidade de seleção múltipla.
Configurações Avançadas de Visualização com Emmet
Na página do GitHub do Emmet para Sublime, você descobrirá caminhos inexplorados. Aqui você pode definir seus atalhos de teclado usando comandos específicos do ST3 do plugin Emmet. Basta digitar Ctrl+Shift+'
e você encontrará tags de fechamento ainda mais rápido!
Recursos Úteis
- Vinculações de Teclado — o guia oficial dos atalhos de teclado no Sublime Text para aqueles que buscam aumentar a produtividade.
- Edição — Documentação Não Oficial do Sublime Text — expande o conceito da funcionalidade Expandir Seleção para trabalhar com tags HTML no Sublime Text.
- BracketHighlighter - Pacotes - Package Control — um plugin eficaz para representar visualmente a correspondência de colchetes e tags.
- GitHub - emmetio/sublime-text-plugin — todos os segredos do seu plugin Emmet favorito para controlar a mágica do HTML e CSS.
- Sublime Text Power User — uma imersão nas capacidades do Sublime Text através de uma série de vídeos tutoriais.
- Notícias - Sublime HQ — atualizações contemporâneas e dicas que ajudam a manter a produtividade no Sublime Text.