Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Lista de Exercício

1) Adicionando um subtítulo à página

<div class="apresentacao__links">
    <h2>Acesse minhas redes:</h2> 
    <a href="https://www.instagram.com/seu_instagram" target="_blank">
        <img src="./assets/instagram.svg" alt="Logo do Instagram">
        Instagram
    </a>
    <a href="https://github.com/seu_github" target="_blank">
        <img src="./assets/github.svg" alt="Logo do GitHub">
        GitHub
    </a>
</div>

2) Alterando a disposição dos elementos com Flexbox

.apresentacao__links {
    display: flex;
    flex-direction: column; /* Alinha os elementos verticalmente */
}

3) Ajustando o alinhamento e o espaçamento dos elementos

.apresentacao__links {
    display: flex;
    flex-direction: column;
    align-items: center; /* Centraliza os elementos verticalmente */
    gap: 32px; /* Adiciona espaçamento entre os elementos */
}

4) Criando uma classe para o subtítulo

<div class="apresentacao__links">
    <h2 class="apresentacao__links__subtitulo">Acesse minhas redes:</h2> 
    <a href="https://www.instagram.com/seu_instagram" target="_blank">
        <img src="./assets/instagram.svg" alt="Logo do Instagram">
        Instagram
    </a>
    <a href="https://github.com/seu_github" target="_blank">
        <img src="./assets/github.svg" alt="Logo do GitHub">
        GitHub
    </a>
</div>

5) Estilizando o subtítulo

.apresentacao__links__subtitulo {
    font-family: 'Krona One', sans-serif;
    font-weight: 400;
    font-size: 24px;
}

6) Modificando o estilo dos botões

.apresentacao__links__link {
    background-color: transparent; /* Remove o fundo ciano */
    color: #F6F6F6; /* Altera a cor do texto para branco */
    border: 2px solid #22D4FD; /* Adiciona borda ciano */
    width: 378px; /* Largura dos botões */
    border-radius: 8px; /* Ajusta o arredondamento dos cantos */
}
2 respostas
solução!

Olá, Kauã, como vai?

Seu código está muito bem estruturado e atende perfeitamente ao exercício. Você utilizou corretamente as tags HTML e aplicou as propriedades CSS de forma correta. A hierarquia de classes e o uso do Flexbox foram bem implementados. O código está ótimo. Continue compartilhando suas conquistas aqui no fórum.

Siga firme nos seus estudos!

Abraços :)

Olá Mike, Tudo bem?

Muito obrigado pelo seu feedback tão positivo! Fico contente em saber que a estrutura do meu código e a implementação do Flexbox foram bem recebidas. Comentários como o seu me motivam a continuar aprimorando minhas habilidades e a compartilhar mais no fórum. Agradeço por seu incentivo e apoio!

Abraços!