Desafio de Revisão nº 1

Parte da seção Styling with CSS do Journey de HTML da Coddy — lição 29 de 76.

Desafio

Fácil

Agora que você dominou várias técnicas para estilizar texto e fundos usando CSS, é hora de colocar seu conhecimento à prova com um desafio abrangente. Você aplicará o que aprendeu sobre cores, códigos hexadecimais, valores RGB e transparência com RGBA para criar um design específico.

Você recebeu um documento HTML com um título (<h1>), um parágrafo (<p>) e uma divisão (<div>). Sua tarefa é usar as propriedades de estilização de texto e fundo que você aprendeu para estilizar esses elementos de acordo com o design mostrado na imagem abaixo:

Siga os passos abaixo:

Escreva uma regra CSS que tenha como alvo o elemento <h1>. Defina a color como white, a background-color como #000080 (azul marinho) e o text-align como center.
Escreva uma regra CSS que tenha como alvo o elemento <p>. Defina a color como #FFFFFF (branco), a background-color como rgba(0, 0, 0, 0.5) (preto semitransparente) e o font-size como 18px.
Escreva uma regra CSS que tenha como alvo o elemento <div>. Defina a background-color como rgba(237, 170, 26, 1) (amarelo dourado) e a color como white.

Experimente você mesmo

<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>