El CSS (Cascading Style Sheets) es un lenguaje esencial para el diseño y presentación de páginas web. Permite separar el contenido de la estructura y el diseño, facilitando la creación de sitios web atractivos y funcionales. En este post, exploraremos la anatomía de una declaración CSS y los tipos de selectores básicos y combinadores más utilizados.

Anatomía de una Declaración CSS

Una declaración CSS consiste en un selector y una serie de reglas de estilo. Aquí desglosamos sus componentes:

• Selector: Indica a qué elementos HTML se aplicarán las reglas de estilo.
• Propiedad: Define qué aspecto del elemento será modificado.
• Valor: Especifica el valor que se asignará a la propiedad.
• Bloque de Declaración: Encierra las propiedades y valores dentro de llaves {}.

Ejemplo de una Declaración CSS:

p {
  color: blue;
  font-size: 16px;
}

• Selector: p (selecciona todos los elementos <p>).
• Propiedad: color y font-size.
• Valor: blue y 16px.
• Bloque de Declaración: { color: blue; font-size: 16px; }.

Tipos de Selectores Básicos

Selector de Elemento: Selecciona todos los elementos de un tipo dado.

• Selector de Elemento: Selecciona todos los elementos de un tipo dado. Aplica estilo a todos los párrafos (<p>).

   p {
     color: green;
   }

• Selector de Clase: Selecciona elementos con una clase específica. Aplica estilo a todos los elementos con la clase miClase.