La etiqueta <link> en HTML se usa para definir un enlace entre un documento y un recurso externo. La etiqueta de enlace se utiliza principalmente para vincular a hojas de estilo externas. Este elemento puede aparecer varias veces, pero solo va en la sección de encabezado. El elemento de enlace está vacío, solo contiene atributos. Los valores en el elemento de enlace indican cómo el elemento que se vincula y se relaciona con el documento que lo contiene.
Sintaxis:
<link rel="stylesheet" type="text/css" href="styles.css">
Valores de atributos:
- charset : se utiliza para especificar la codificación de caracteres para el documento vinculado HTML.
- crossOrigin : Asigna la configuración CORS del documento vinculado.
- disabled : Se utiliza para especificar que el documento vinculado está deshabilitado.
- href : se utiliza para especificar la URL del documento vinculado.
- hreflang : se utiliza para especificar el idioma de un documento vinculado.
- media : se utiliza para especificar para qué medio/dispositivo está optimizado el recurso de destino.
- rel : Se utiliza para especificar la relación entre el documento actual y el vinculado.
- rev : Asigna la relación inversa del documento vinculado al documento actual.
- tamaños : se usa para especificar los tamaños del ícono para medios visuales y solo funciona cuando rel = «icono».
- destino : Se utiliza para especificar la ventana o un marco donde se carga el documento vinculado.
- type : Se utiliza para establecer/devolver el tipo de contenido del documento vinculado.
Ejemplo 1: En este ejemplo, hemos usado la etiqueta <link> y declarado el atributo rel y el atributo type dentro de la etiqueta en HTML.
HTML
<!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <h1>GeeksforGeeks</h1> <h3>HTML Link Tag</h3> <p> A Computer Science portal for geeks. It contains well written, well thought and well explained computer science and programming articles. </p> </body> </html>
Producción:
Ejemplo 2: En este ejemplo, hemos utilizado el atributo hreflang cuyo valor se establece en » en-us » que especificará el idioma del documento vinculado. Y estamos vinculando un archivo CSS externo que contiene una propiedad de color para la etiqueta h1 que está configurada en verde.
HTML
<!DOCTYPE html> <html> <head> <title>HTML Link Tag</title> <link rel="stylesheet" type="text/css" href="style.css" hreflang="en-us"> </head> <body> <h1>GeeksforGeeks</h1> <h2>HTML Link Tag</h2> </body> </html>
Producción:
Navegadores compatibles:
- Google cromo 1
- explorador de Internet
- Microsoft borde 12
- Firefox 1
- Safari
- Ópera
Publicación traducida automáticamente
Artículo escrito por Vijay Sirra y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA