Menu
Coddy logo textTech

Desafio de Revisão #1

Parte da seção Estilização com CSS do Journey de HTML da Coddy. Lição 29 de 76.

challenge icon

Desafio

Fácil

Agora que você já domina várias técnicas para estilizar textos e planos de fundo usando CSS, é hora de testar seus conhecimentos 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 estilo de texto e plano de fundo que aprendeu para estilizar esses elementos de modo que correspondam ao design mostrado na imagem abaixo:

Siga as etapas abaixo:

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

Todas as lições de Estilização com CSS

Pratique por conta própria: Playground de Web