Desenvolvendo | HTML e CSS: cabeçalho, footer e variáveis CSS

Sobre mim

Lorem ipsum dolor sit amet...

CSS:

:root { --cor-primaria:#FA7070; --cor-secundaria:#FBF2CF; --cor-terciaria:#C6EBC5; } * { margin: 0; padding: 0; } //... restante do codigo // Exemplo de substituicao no arquivo .cabecalho { background-color: var(--cor--primaria); //... outros estilos } .rodape { color: var(--cor--secundaria); //... outros estilos } .cabecalho__menu__link:hover { color: var(--cor-terciaria); //... outros estilos } //... restante do codigo

Olá Eleazar!

Ótimo trabalho, seu código está bom. Fico feliz! Mas só uma observação no seu código. Onde tem um pequeno erro de digitação, e só para se certificar é bom reparar, ele acontece após a URL da imagem. Há uma linha com erro:

<img src=".assets/imagem.png"68153E49 alt="Foto da Joana Santos programando">

Repare essa linha, para evitar erros futuros na hora de colocar no Ar.

Certifique-se de que o caminho da imagem está correto e que não há caracteres extras. Além disso, o fechamento das tags <main> e <section> está faltando em algumas partes. Aqui está uma versão corrigida:

<!DOCTYPE html>
<html lang="pt-br">
<body>
    <!-- cabecalho omitido -->
    <main class="apresentacao">
        <section class="apresentacao__conteudo">
            <h1 class="apresentacao__conteudo__titulo">Sobre mim</h1>
            <p class="apresentacao__conteudo__texto">Lorem ipsum dolor sit amet...</p>
            <p class="apresentacao__conteudo__texto">Lorem ipsum dolor sit amet...</p>
            <img src=".assets/imagem.png" alt="Foto da Joana Santos programando">
        </section>
    </main>
    <!-- rodape omitido -->
</body>
</html>

No seu CSS, percebi que há uma pequena inconsistência na declaração das variáveis. Você usou --cor--primaria (com dois hífens), mas ao usar, usou --cor-primaria (com um hífen só).

Espero ter ajudado! Bons estudos!

Sucesso ✨