Etiqueta link / Enlace hoja de estilos CSS


El elemento HTML <link> especifica la relación entre el documento actual y un recurso externo. Los usos posibles de este elemento incluyen la definición de un marco relacional para navegación. Este elemento es más frecuentemente usado para enlazar hojas de estilos.

Suele ser utilizado para definir CSS en un archivo externo; en este caso, todos los estilos CSS se incluyen en un archivo de tipo CSS que las páginas HTML enlazan mediante la etiqueta <link>. Un archivo de tipo CSS no es más que un archivo simple de texto cuya extensión es .css Se pueden crear todos los archivos CSS que sean necesarios y cada página HTML puede enlazar tantos archivos CSS como necesite.

Si se quieren incluir los estilos  en un archivo CSS externo, se deben seguir los siguientes pasos:

1) Se crea un archivo de texto y se le añade solamente el siguiente contenido:
p { color: green; font-family: Arial; }
2) Se guarda el archivo de texto con el nombre estilos.css Se debe poner especial atención a que el archivo tenga extensión .css y no .txt
3) En la página HTML se enlaza el archivo CSS externo mediante la etiqueta <link>:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Ejemplo de estilos CSS en un archivo externo</title>
<link rel="stylesheet" type="text/css" href="/css/estilos.css" media="screen" />
</head>
 
<body>
<p>Un párrafo de texto como ejemplo.</p>
</body>
</html>
 
El navegador cargará la página HTML anterior, pero antes de mostrar sus contenidos también descargará los archivos CSS externos enlazados mediante la etiqueta <link> y aplicará los estilos a los contenidos de la página.



Fuente: librosweb.es

Comentarios

Entradas populares de este blog

Códigos Hex de color

Enlaces Intradocumentales

Etiqueta header HTML5