1
resposta

lista de exercicios

Exercício 1

<div class="apresentacao__links">
       <h2 class="apresentacao__links__subtitulo">Acesse minhas redes:</h2>
        <a class="apresentacao__links__link" href="https://www.instagram.com/paulo_henryque__/">
        <img class="logoInstagram" src="./assets/instagram.png" alt="logo-instagram">Instagram</a>
        <a class="apresentacao__links__link" href="https://github.com/Paulo-back">
         <img class="logoGitHub" src="./assets/github.png" alt="logo-gitHub"> GitHub</a>
         <a class="apresentacao__links__link" href="https://www.linkedin.com/in/paulo-henrique-rosa-dev/">
         <img class="logoTwitch" src="./assets/linkedin.png" alt="Logo-Twitch"> Twitch</a>
          
    </div>

Exercício 2 e 3

.apresentacao__links__link {
    display: flex;
    justify-content: center;
    align-items: center; 
    gap: 16px;
    border: 2px solid #22D4FD;
    width: 280px;
    text-align: center;
    border-radius: 8px;
    font-size: 24px;
    font-weight: 600;
    padding: 21.5px 0;
    text-decoration: none;
    color: #f6f6f6;
    font-family: "Montserrat", sans-serif;
}

ex 4

.apresentacao__links__link:hover{
    background-color: #272727;
}

ex5

.apresentacao__links__link:hover{
    cursor: pointer;
    background-color: #272727;
}
1 resposta

Oi, Renata!

Obrigado por compartilhar suas reflexões e aprendizados com a comunidade Alura.

Gostei da sua implementação dos links clicáveis, e a estrutura do HTML está bem organizada! No exercício 1, notei que a imagem do LinkedIn está com a classe logoTwitch, o que pode causar confusão no código.

Para melhorar a acessibilidade, uma dica é adicionar o atributo target="_blank" nos links para que eles abram em uma nova aba, assim o usuário não sai da sua página.

Espero ter ajudado! Bons estudos!

Sucesso