Hojas de estilos

¡Hola de nuevo!
En esta ocasión vamos a hablar sobre las hojas de estilos. Y os preguntaréis: ¿y eso qué es? Pues vamos a ello.
Las hojas de estilos sirven para configurar como van a aparecer los elementos HTML en la pantalla. Se pueden definir como un conjunto de propiedades de formato, más reglas de definición y aplicación.
Vamos a comenzar con las reglas de estilo, que son componentes de las hojas de estilo. Están compuestas por un selector (indica las etiquetas a las que se aplica) y una declaración (conjunto de propiedades). Hay diferentes tipos de selectores:

• Basado en el elemento (etiqueta): aplica un estilo a las declaraciones de de uno o más tipos de etiquetas, como pueden ser párrafos. 
• Basado en el contexto del elemento: se aplica a un elemento dentro de otro elemento, como pueden ser todas las palabras en negrita dentro de un bloque. 
• Basado en un identificador o una clase: se utiliza el selector ID para seleccionar un único elemento dentro de la página. Para seleccionar el elemento ID se escribe el símbolo almohadilla (#) seguido del identificador id. Para una clase se escribe un punto (.) y el nombre de la clase. 
• Basado en una pseudoclase: se aplican a vínculos. los estados son:
• Link: no visitado.
• Visited: visitado.
• Hover: ratón sobre el enlace.
• Active: momento en el que se pulsa el enlace
• Pseudoelemento: se aplica a partes específicas de un elemento.

Ahora vamos a hablar sobre las declaraciones de estilos. Hay tres tipos:

• Externa: es un fichero independiente con extensión .css.
• Interna: aparece en la cabecera del documento.
• En línea o local:  se aplica en cualquier etiqueta con el atributo style.

Cuando hay más de un estilo en un elemento se siguen las reglas anteriores según el siguiente orden:

local - interna o externa - por defecto del navegador.

Y hasta aquí un pequeño resumen sobre las hojas de estilos y sus aplicaciones.

¡Hasta pronto!