Tag HTML <link>

Neste artigo, abordaremos o link da tag com exemplos . O objetivo é atender aos requisitos de aprendizagem.

A tag HTML <link> é usada para vincular recursos externos, como folhas de estilo, ícones e outros documentos, a um documento HTML

Um link para uma folha de estilo externa é fornecido aqui:

Example: 

1
2
3
4
5
6
7
8
9
10
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="\mrx_example.css">
</head>
<body><p>Hey User !! You are learning HTML link tag.</p>
</body></html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Aqui, um exemplo da tag de link dentro da tag de cabeçalho style.css define como o navegador deve estilizar os elementos da página da web e os links para os artigos anteriores e posteriores:

Example: 

1
2
3
4
5
6
7
8
9
10
11
<!DOCTYPE html>
<html>
<head>
<title>Mr Examples</title>
<link rel="stylesheet" type="text/css" href="\mrx_example.css">
</head>
<body>
<a href="#">Hover on this link to check the animation</a>
</body>
</html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX


Um link Tag <link> indica a conexão entre o documento atual e um recurso externo.

A tag <link> é comumente aplicada para vincular a folhas de estilo externas.

O único conteúdo de um link são seus atributos. Caso contrário, é um elemento vazio .

Aqui estão alguns casos de uso comuns para a tag <link> :

  • O uso mais comum da tag <link> é vincular uma folha de estilo externa a um documento HTML. Isso permite definir estilos em um arquivo separado e aplicá-los a várias páginas em um site. Isso pode ajudar a manter a consistência no design e facilitar a atualização dos estilos em todo o site.
  • A tag <link> também pode ser usada para vincular arquivos de ícone, como arquivos favicon.ico que aparecem na barra de endereço do navegador ou em guias. Isso pode ajudar a aprimorar a marca e a identidade visual do seu site.
  • A tag <link> pode ser usada para vincular outros documentos, como arquivos XML ou feeds RSS. Isso pode permitir que os usuários acessem conteúdo ou dados adicionais relacionados ao seu site.
  • A tag <link> também pode ser usada para vincular scripts externos, como arquivos JavaScript. Isso pode permitir que você adicione funcionalidades ao seu site, como interatividade ou conteúdo dinâmico.
  • A tag <link> pode ser usada para especificar a relação entre o documento atual e outro documento, como uma versão de idioma alternativo ou uma versão móvel. Isso pode ajudar os mecanismos de pesquisa a indexar e classificar seu site com mais eficiência.

Lista de Atributos

Atributo Valor Visão geral
tipo tipo de mídia

Indique o tipo de mídia do documento vinculado.

rele
autor alternativo
dns-pré-busca ícone de
ajuda licença próximo pingback pré-conexão pré- busca pré-carregamento pré -processamento folha de estilo de pesquisa anterior










É necessário. Fornece detalhes sobre a relação entre o documento atual e seu documento vinculado.

título

Fornece uma folha de estilo recomendada ou alternativa.

origem cruzada
credenciais de uso anônimas

Fornece instruções sobre como lidar com solicitações de origens cruzadas.

href URL

Fornece a URL do documento vinculado.

hreflang language_code

Inclui informações sobre o idioma do documento vinculado.

meios de comunicação media_query

Indica o dispositivo no qual o documento vinculado será renderizado.

política de referência no-referrer
no-referrer-quando-downgrade
origem
origem-quando-origem cruzada
url inseguro

Fornece o referenciador a ser usado ao buscar o recurso.

tamanhos Altura x Largura
qualquer

Define o tamanho do recurso vinculado. Apenas para rel=”icon”


Atributos

Global

Tag link <link> também pode aceitar Atributos Globais em HTML.

Evento

Tag link <link> também pode aceitar Atributos de Evento em HTML.


Compatibilidade do navegador

A maioria dos navegadores é compatível com o link de tag quando usado para folhas de estilo. Fora isso, nada mais é suportado.

Elemento
<link> Sim Sim Sim Sim Sim

CSS predefinido

Em muitos navegadores, o elemento <link> aparecerá com os seguintes valores padrão:

link {
display: none;
}

A tag HTML <link> oferece várias vantagens para desenvolvedores da Web, incluindo:

  • A tag <link> permite separar a apresentação de sua página web (estilos, ícones, etc.) de seu conteúdo. Isso pode facilitar a manutenção e atualização do seu site, pois as alterações na apresentação podem ser feitas independentemente do conteúdo.
  • Ao vincular recursos externos usando a tag <link> , você pode reduzir o tamanho do seu documento HTML e melhorar o tempo de carregamento da página. Isso ocorre porque os recursos vinculados são carregados separadamente e podem ser armazenados em cache pelo navegador para acesso mais rápido no futuro.
  • A tag <link> pode ser usada para vincular scripts externos, como arquivos JavaScript, que podem adicionar interatividade e conteúdo dinâmico à sua página da web. Isso pode ajudar a criar uma experiência de usuário mais envolvente para seus visitantes.
  • A tag <link> pode ser usada para especificar a relação entre o documento atual e outro documento, como uma versão de idioma alternativo ou uma versão móvel. Isso pode ajudar os usuários a navegar em seu site com mais facilidade, principalmente se estiverem usando tecnologias assistivas.
  • A tag <link> pode ser usada para fornecer metadados sobre seu site, como autor, palavras-chave e descrição. Isso pode ajudar os mecanismos de pesquisa a indexar e classificar seu site com mais eficiência e melhorar sua visibilidade nos resultados de pesquisa.
Se este artigo foi informativo de alguma forma e forneceu uma ajuda em sua carreira educacional, então compartilhe esta informação significativa com seus amigos clicando nos links abaixo.

Nós valorizamos o seu feedback.
+1
0
+1
0
+1
0
+1
0
+1
0
+1
0
+1
0

Assine a nossa newsletter
Digite seu e-mail para receber um resumo semanal de nossos melhores posts. Saber mais!
ícone