Atributo rel en HTML <link>

Etiqueta <link> de HTML

Definición y uso

Obligatorio rel El atributo especifica la relación entre el documento actual y el documento/enlace/recursos enlazados.

Ejemplo

Ejemplo 1

Importa una hoja de estilo externa:

<link rel="stylesheet" href="styles.css">

Prueba personalmente

Ejemplo 2

A continuación, se describe cómo agregar un ícono de sitio web al sitio:

<!DOCTYPE html>
<html>
<head>
  <title>My Page Title</title>
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>

Sintaxis

<link rel="value">

Valor del atributo

Valor Descripción
alternate

Proporciona un enlace hacia la representación alternativa del documento (por ejemplo, página de impresión, traducción o mirror).

Ejemplo: <link rel="alternate" type="application/atom+xml" href="/blog/news/atom">
author Proporciona un enlace hacia el autor del documento.
dns-prefetch Especifica que el navegador debe realizar el prefetch de DNS para el origen del recurso objetivo.
help

Proporciona un enlace hacia el documento de ayuda.

Ejemplo: <link rel="help" href="/help/">
icon

Importa un icono que representa el documento.

Ejemplo: <link rel="icon" href="favicon.ico" type="image/x-icon">
license Proporciona un enlace con información de copyright del documento.
next Proporciona un enlace hacia el siguiente documento de la serie.
pingback Proporciona la dirección del servidor de pingback para manejar los pingback del documento actual.
preconnect Establece que el navegador debe conectarse proactivamente al origen del recurso de destino.
prefetch Establece que el navegador debe obtener y cachear proactivamente los recursos del destino, ya que podrían usarse en la navegación posterior.
preload Establece que el agente del navegador debe obtener y cachear proactivamente los recursos del destino, según el destino proporcionado por la propiedad "as" (y la prioridad asociada con ese destino).
prerender

Establece que el navegador debe prerender (cargar) la página web especificada en segundo plano.

Si el usuario navega a esta página, acelerará la carga de la página (porque la página ya se ha cargado).

¡Advertencia! Esto consumirá ancho de banda del usuario. ¡Úselo solo cuando esté absolutamente seguro de que la página web es necesaria en algún momento del proceso de navegación del usuario!
prev Indica que este archivo es parte de una serie y que el archivo anterior en la serie es el archivo al que se hace referencia.
search Proporciona enlaces a recursos que se pueden usar para buscar el documento actual y las páginas relacionadas.
stylesheet Importar hoja de estilo.

Compatibilidad con navegadores

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Soporte Soporte Soporte Soporte Soporte

Etiqueta <link> de HTML