Menu
Coddy logo textTech

Desafío de repaso #1

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

challenge icon

Desafío

Fácil

Ahora que has dominado varias técnicas para dar estilo al texto y a los fondos usando CSS, es hora de poner a prueba tus conocimientos con un desafío integral. 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 utilizar las propiedades de estilo de texto y fondo que has aprendido para dar estilo a estos elementos de modo que coincidan con el diseño que se muestra en la imagen a continuación:

Sigue los pasos a continuación:

  1. Escribe una regla CSS que apunte al elemento <h1>. Establece el color a white, el background-color a #000080 (azul marino) y el text-align a center.
  2. Escribe una regla CSS que apunte al elemento <p>. Establece el color a #FFFFFF (blanco), el background-color a rgba(0, 0, 0, 0.5) (negro semitransparente) y el font-size a 18px.
  3. Escribe una regla CSS que apunte al elemento <div>. Establece el background-color a rgba(237, 170, 26, 1) (amarillo dorado) y el color a 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>

Todas las lecciones de Styling with CSS