¿Cómo vincular css externo a una página
Para enlazar una página HTML a una hoja de estilo en cascada (CSS) externa, basta con insertar una sola línea de código en la cabecera de la página que hace referencia el nombre y la ubicación del archivo CSS externo en relación con el nivel de la raíz del servidor en el que la sitio reside.
La línea de código para el enlace debe ser colocado en algún lugar entre la apertura y cierre etiquetas de cada página HTML en su sitio web que desea ser de estilo con él.
Cuando se introduce el nombre de archivo del CSS con precisión en el archivo HTML utilizando la sintaxis de enlace correcto, el código de enlace proporciona instrucciones al navegador acerca de cómo la información de estilo CSS debe ser interpretado y aplicado a la página, que a su vez determina cómo aparece la página en el navegador.
He aquí un ejemplo de un vínculo a un archivo CSS externo con el nombre de archivo main.css, donde el archivo que está siendo originario utiliza el href atributo de la etiqueta de enlace, que es una etiqueta sin cerrar en HTML:
Cuando se añade el código de enlace a una página XHTML, la etiqueta debe estar cerrado mediante la adición de un espacio extra y una barra diagonal antes del final:
Video: HTML y CSS Parte 1 "Enlazar HTML y CSS"
Los otros atributos dentro de la además de la etiqueta href son necesarios para ayudar a que el navegador interpreta los datos en el archivo CSS vinculado:
los rel atributo establece la relación entre el documento original y el archivo vinculado, e identifica el archivo vinculado como una hoja de estilo.
Video: como vincular documento css a html - curso dreamweaver compatible con dispisitivos , video 5
los tipo atributo especifica el tipo de lenguaje de estilo que se utiliza en el archivo vinculado, que en este caso identifica que el archivo vinculado está escrito en formato “text / css”.
Por coherencia, trate de colocar el enlace de CSS en sus páginas web en la misma ubicación dentro del código de página en página. Por ejemplo, es posible que desee agregar la etiqueta de enlace inmediatamente después de la última etiqueta meta, o colocarlo justo encima de la etiqueta de cierre. Ser coherente puede ayudar a encontrar rápidamente la etiqueta si alguna vez necesita para modificarlo.
Video: Utilizando o método linkar para vincular o CSS ao HTML
Además de la colocación del enlace dentro de las páginas HTML que utilizan el archivo CSS externo, también se debe prestar atención a que el archivo (s) CSS se encuentra en relación con los otros archivos dentro del sitio.
Muy a menudo, cada sitio tiene un solo archivo CSS, y que el archivo se encuentra en el nivel raíz, que es sólo una forma elegante de decir que el archivo CSS se encuentra en la misma ubicación que el index.html archivo, que es la página principal de su sitio.
Video: Insertar Codigo CSS desde un Archivo Externo
El nivel de la raíz se refiere a la planta baja de su sitio, si se trata de una copia local de su sitio sentado en su ordenador delante de usted o de una copia del sitio ubicado en el servidor host remoto. Con la mayoría de los sitios, la página principal se encuentra en el nivel raíz junto con una imágenes carpeta y todas las otras páginas principales del sitio.
Para los sitios más grandes, algunos diseñadores crear subcarpetas en el nivel raíz para albergar otras cosas tales como archivos externos de javascript y jQuery, archivos CSS externos, scripts CGI, o grupos de páginas que caen en una categoría similar (por ejemplo, todas las páginas relativas a productos o servicios de una empresa).
En caso de que su sitio requiere dos o más hojas de estilo en cascada (quizás uno para todas las páginas y una segunda para un puñado de páginas que se imprimirán), puede ser beneficioso para usted para crear una carpeta separada llamada css en el nivel raíz del sitio y luego guardar los archivos CSS juntos dentro de ella.
A continuación, puede acceder a cada CSS desde esa ubicación, siempre que el href de la CSS enlace indica la nueva ubicación de la carpeta junto con el nombre del archivo:
href ="css / main.css" rel ="hoja de estilo" type ="text / css"gt;