Entrar Ainda não tem acesso?
1
resposta

Paleta de Cores

Referente ao curso HTML e CSS: cabeçalho, footer e variáveis CSS, no capítulo Aplicando variáveis CSS e atividade Faça como eu fiz: personalizando a paleta de cores!

por Viviane De Lima Noronha
| 27.6k xp | 58 posts
<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Portfolio</title>
        <link rel="stylesheet" href="style.css">
    </head>

<body>
    <header class="cabecalho">
        <nav class="cabecalho__menu">
            <a class="cabecalho__menu__link">Home</a>
            <a class="cabecalho__menu__link">Sobre Mim</a>
        </nav>
    </header>
    <main class="apresentacao">
        <section class="apresentacao__conteudo">
        <h1 class="conteudo__titulo">Eleve seu negócio digital a outro nível<strong class="titulo-destaque">com um Front-end de qualidade!</strong></h1>
        <p class="conteudo__texto">Olá! Sou Viviane Lima, desenvolvedora Front-end com especialidade em <strong>React, HTML e CSS</strong>. Ajudo pequenos negócios e designers a colocarem em prática boas ideias. Vamos conversar?</p>
        <div class="apresentacao__links">
        <a class="links__link" href="https://instagram.com/rafaballerini"><img src="./assets/instagram.png">Instragram</a>
        <a class="links__link" href="https://github.com/guilhermeonrails"><img src="./assets/github.png"> Github</a>
    </div>
</section>
        <img src="Moça.png" alt="Foto da Joana Santos programando" class="imagem-circular">
    </main>
    <footer Class="rodape">
        <p>Desenvolvido por Viviane Noronha.</p>
    </footer>
</body>

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

Infelizmente, não consigo acessar as imagens do istagram e github

1 resposta
por Rafaela Petelin Silvério
| 722.8k xp | 1625 posts
Alura Scuba Team Monitora de Fórum

Oi, Viviane! Como vai?

Obrigada por compartilhar seu código com a comunidade Alura.

Gostei de como você organizou sua estrutura HTML e utilizou classes para estilização. Seu código está bem estruturado!

Sobre as imagens do Instagram e GitHub não estarem aparecendo, o problema pode estar no caminho dos arquivos. No seu código, você usou src="./assets/instagram.png", mas o navegador só conseguirá carregar a imagem se o arquivo realmente existir nessa pasta. Para corrigir, verifique se:

  1. O arquivo instagram.png está dentro da pasta assets no mesmo local onde está o seu HTML.
  2. O nome do arquivo está exatamente igual, respeitando maiúsculas e minúsculas.
  3. O caminho da imagem está correto. Se o HTML estiver em uma pasta diferente, pode ser necessário ajustar o caminho, por exemplo:

<a class="links__link" href="https://instagram.com/rafaballerini">
    <img src="assets/instagram.png" alt="Ícone do Instagram"> Instagram
</a>

Caso a imagem esteja hospedada online, você pode usar a URL completa, como: 


<img src="https://exemplo.com/imagem.png" alt="Ícone do Instagram">

Verifique esses pontos e qualquer dúvida, estamos por aqui!

Conte com o apoio do Fórum na sua jornada. Abraços e bons estudos!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado