Selector de tipo

Parte de la sección Styling with CSS del Journey de HTML de Coddy — lección 11 de 76.

El selector de tipo, también conocido como selector de elemento o selector de etiqueta, selecciona elementos HTML basándose en sus nombres de etiqueta. Es uno de los selectores más simples y fundamentales en CSS.

Aquí está la sintaxis básica para usar un selector de tipo:

tagname {
    property: value;
}

tagname: El nombre de la etiqueta HTML a la que quieres dar estilo (por ejemplo, p, h1, div).
property: La propiedad CSS que quieres establecer (por ejemplo, color, font-size).
value: El valor que quieres establecer para la propiedad (por ejemplo, blue, 16px).

Por ejemplo:

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

En este ejemplo, el selector de tipo p selecciona todos los elementos <p> (párrafo) en el documento HTML. Las declaraciones establecen el color del texto en azul y el tamaño de fuente en 16 píxeles para todos los párrafos.

Desafío

Fácil

Se te proporciona un documento HTML con varios elementos, incluyendo encabezados (<h1>, <h2>), párrafos (<p>) y divisiones (<div>). Tu tarea es usar selectores de tipo para dar estilo a estos elementos. Sigue los pasos a continuación:

Escribe una regla CSS que afecte a todos los elementos <h1>. Establece el color de texto de los encabezados <h1> a darkred.
Escribe una regla CSS que afecte a todos los elementos <h2>. Establece el color de texto de los encabezados <h2> a green.
Escribe una regla CSS que afecte a todos los elementos <p>. Establece el color de texto de los párrafos a blue y el tamaño de fuente a 18 píxeles.
Escribe una regla CSS que afecte a todos los elementos <div>. Establece el color de fondo de las divisiones a lightblue.

Pruébalo tú mismo

<html>
<head>
    <title>Type Selector</title>
    <style>
        /* Write CSS rules here */
    </style>
</head>
<body>
    <h1>This is a main heading</h1>
    <h2>This is a subheading</h2>
    <p>This is a paragraph.</p>
    <div>This is a division.</div>
</body>
</html>