Selectores CSS

¡Enhorabuena! Acaba de introducir estilos CSS externos en su página HTML.

Cuando se especifican estilos de etiqueta mediante el atributo style, el navegador sabe inmediatamente a qué etiqueta aplicar esos estilos. Pero cuando los estilos se adjuntan mediante un archivo externo o a través de la etiqueta <style>, el navegador busca las etiquetas con estilo utilizando "selectores".

Ya estás un poco familiarizado con los selectores: en la tarea anterior, utilizaste el selector p, que estaba delante de las llaves en el código CSS. La sintaxis de las reglas CSS es la siguiente:

selector {
    propiedad1: valor1;
    propiedad2: valor2;
    ...
}

El lenguaje de los selectores es muy potente y flexible. Los selectores más sencillos son los selectores por nombre de etiqueta: p, h1, etcétera. El navegador aplica los estilos de una regla con este selector a todas las etiquetas coincidentes. Por ejemplo, a todos los párrafos o a todos los títulos de primer nivel.

En nuestro cospecto, el selector p ha resaltado todos los pár rafos en verde. ¿Cómo hacerlos de diferentes colores? Puedes añadir otras etiquetas dentro de los párrafos. A continuación, puede utilizar selectores para diferentes etiquetas en CSS y darles diferentes colores.