Cómo agregar un archivo de hoja de estilos para una página Web

Hojas de estilo externas tienen ventajas sobre los estilos incrustados, el mayor beneficio es la facilidad de cambios. El uso de una o dos hojas de estilo, puede actualizar el diseño de un sitio web completo, haciendo algunos cambios simples. El "<link>" etiqueta puede incrustar archivos de hojas de estilo, también conocidas como las Hojas de Estilo en Cascada (CSS). Añadir las hojas de estilo en la cabeza de sus páginas Web en orden ascendente de importancia, por lo que la hoja de estilo más importante es pasado.

Instrucciones

1

Ir a "Inicio" en la barra de tareas de Windows y escriba "Bloc de notas" en el cuadro de búsqueda. Si utiliza un editor de código, introduzca su nombre en su lugar. Haga clic en "Archivo" en la barra de menú superior y abra su página Web. Su código aparecerá en el editor.

2

Añadir un "<link>" en la línea por debajo de los "<title>" etiquetas. Dar el "<link>" "href" etiqueta "rel" y "tipo" atributos:

<Link href = "" rel = "" type "=" />

Tenga en cuenta que en HTML 5, no es necesario el atributo "tipo" o el cierre de barra diagonal al final de la etiqueta. Omita estos si usted sabe que su código utiliza HTML 5, pero dejarlos si usted no sabe a ciencia cierta lo que la especificación de HTML que utiliza.

3

Ajuste el "rel" atributo a "stylesheet" y establecer "tipo" a "text / css" para que el navegador sabrá que el enlace contiene una hoja de estilos CSS:

<Link href = "" rel = "stylesheet" type = "text / css" />

4

Escriba la ruta completa o relativa al archivo CSS dentro de las comillas dobles siguientes el atributo "href":

<Link href = "path / to / stylesheet.css" rel = "stylesheet" type = "text / css" />

<Link href = "http://yoursite.com/path/to/stylesheet.css" rel = "stylesheet" type = "text / css" />

En los ejemplos anteriores, el primer "<link>" etiqueta muestra una ruta relativa, mientras que el segundo "<link>" etiqueta muestra una ruta completa del archivo. Si usted no entiende las rutas relativas, usar rutas completas.

Consejos y advertencias

  • Trate de poner todo el código CSS en una hoja de estilo único. Cada vez que el navegador tiene que cargar otro archivo, se ralentiza su sitio web, por lo que la combinación de hojas de estilo en un solo ayudará a optimizar los tiempos de carga de página.
  • Usted no puede poner "<link>" etiquetas fuera de la cabeza de sus páginas Web. Asegúrese de que usted los pone entre "<head>" etiquetas.