Desafío de repaso n.º 1

Parte de la sección Estilos con CSS del Journey de HTML de Coddy. Lección 29 de 76.

Desafío

Fácil

Ahora que has dominado varias técnicas para aplicar estilos al texto y a los fondos usando CSS, es hora de poner a prueba tus conocimientos con un desafío completo. Aplicarás lo que has aprendido sobre colores, códigos hexadecimales, valores RGB y transparencia con RGBA para crear un diseño específico.

Se te proporciona un documento HTML con un encabezado (<h1>), un párrafo (<p>) y una división (<div>). Tu tarea es usar las propiedades de estilo de texto y fondo que has aprendido para aplicar estilos a estos elementos de modo que coincidan con el diseño mostrado en la imagen de abajo:

Sigue los pasos a continuación:

Escribe una regla CSS que seleccione el elemento <h1>. Establece color en white, background-color en #000080 (azul marino) y text-align en center.
Escribe una regla CSS que seleccione el elemento <p>. Establece color en #FFFFFF (blanco), background-color en rgba(0, 0, 0, 0.5) (negro semitransparente) y font-size en 18px.
Escribe una regla CSS que seleccione el elemento <div>. Establece background-color en rgba(237, 170, 26, 1) (amarillo dorado) y color en white.

Pruébalo tú mismo

<html>
<head>
    <title>Recap Challenge #1</title>
    <style>
        /* Write CSS rules here */
    </style>
</head>
<body>
    <h1>This is a heading</h1>
    <p>This is a paragraph.</p>
    <div>This is a division.</div>
</body>
</html>