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

Practica por tu cuenta: Playground de Web