├── folder1
| └── page2.html
├── page1.html
├── index.html
Aqui temos três casos de uso e, para cada um, criaremos um exemplo.
Navegue para páginas no mesmo nível
Browse to Page 1
Como você pode ver, a página page1.html está no mesmo nível, portanto, o caminho da href O atributo é apenas o nome da página.
Navegue para páginas localizadas em outra pasta
Browse to Page 2
Aqui, temos um caso de uso diferente, pois a página que queremos visitar agora não está no mesmo nível. E para poder navegar para essa página, devemos especificar o caminho completo do arquivo, incluindo a pasta.
Ótimo! Vamos agora mergulhar no último caso de uso.
Navegue de uma página localizada em uma pasta para a raiz
Browse to the Home Page
Agora, aqui para navegar para o index.html página, devemos primeiro subir um nível antes de poder navegar para essa página.
Dito isto, agora cobrimos links internos, vamos seguir em frente e apresentar como navegar para links externos.
Como criar links externos
É sempre ótimo e útil ter a capacidade de não apenas navegar entre as páginas de um site, mas também navegar para sites externos.
Browse to Google
Como você pode ver aqui, para navegar para o Google, precisamos especificar seu URL para o href atributo.
Links externos e internos são usados para navegar da página A para a página B. No entanto, às vezes queremos permanecer na mesma página e navegar para uma parte específica. E para fazer isso, temos que usar algo chamado link âncora, vamos mergulhar nele na próxima seção.
Como criar links âncora
Um link de âncora é um pouco específico, pois permite navegar de um ponto A para um ponto B enquanto permanece na mesma página. Também pode ser usado para ir para uma parte em outra página.
Navegue na mesma página
Go to the anchor
Comparando com os outros, este é um pouco diferente. Na verdade, é, no entanto, funciona da mesma maneira.
Aqui, em vez de um link de página, temos uma referência a um elemento e, quando clicamos no link, ele procurará um elemento com o mesmo nome sem a hashtag (about) e se encontrar esse ID, ele navegará para essa parte.
Navegue em outra página
Go to the anchor
É praticamente o mesmo que o anterior, exceto que temos que definir a página na qual queremos navegar e adicionar a âncora a ela.
Conclusão
o href é o atributo mais importante do a tag. Ele nos permite navegar entre as páginas ou apenas uma parte específica de uma página. Felizmente, este guia o ajudará a criar um site com muitos links.
Obrigado pela leitura.
Sinta-se à vontade para me procurar!
TWITTER BLOG BOLETIM DE NOTÍCIAS GITHUB LINKEDIN CODEPEN DEV