Llegamos al punto en el que ya conocemos las bases del HTML y del CSS y tenemos claro que debemos referenciarlos para poder tener nuestra página web con estilo.
Podemos hacerlo de tres formas diferentes. La más recomendada es a partir de un archivo externo. Esto lo hacemos dentro de las etiquetas <head> </head>, escribiendo una etiqueta link con el atributo href indicando el nombre de la hoja de estilo o la ruta, es decir la dirección absoluta (http:// etc…) o puede ser local si referenciamos a un archivo que tenemos en una misma carpeta o subdirectorio del proyecto. Con esto vamos a poder diferenciar el archivo HTML del CSS. Por ejemplo:
Esta es la mejor práctica por razones de orden y comodidad, dado que podemos referenciar varios documentos HTML al mismo tiempo.
Las otras dos formas de referenciar serán desde el mismo documento HTML.
La segunda será también dentro de la etiqueta <head> </head>, creando una etiqueta <style> </style> e incluyendo dentro los estilos sin referenciar a un archivo externo. Por ejemplo:
La tercera forma, es referenciar desde el elemento mismo a partir de la propiedad en línea de la etiqueta <style>. Directamente aplicamos una propiedad y un valor CSS en línea separando con ; (punto y coma), si incluimos más de un estilo. Ejemplo:
Con este tema más los posteos anteriores, completamos lo básico necesario para empezar a trabajar en la diagramación de nuestra página web desde cero. En la próxima entrada ya empezaremos a hablar del texto y la tipografía.