1
resposta

Respostas da lista de exercícios

Exercício um) Ajustando a altura da tela com CSS

Conteúdo CSS:

body {
    height: 100vh;
    background-color: #000000;
    color: #f6f6f6;
}

Exercício dois) Controlando o tamanho de elementos com Box Sizing

Conteúdo CSS:

body {
       box-sizing: border-box;
}	   

Exercício três) Criando um layout sem scroll

Conteúdo CSS:

body {
    display: flex;
    align-items: center;
}

Exercício quatro) Flexbox: alinhando textos e imagens

Conteúdo HTML:

    <main class="apresentacao">
        <h1>Eleve seu negócio digital a outro nível <strong class="titulo-destaque"> um Front-end de qualidade!</strong></h1>
        <p>Olá! Sou Joana Santos, desenvolvedora Front-end com especialidade em React, HTML e CSS. Ajudo pequenos negócios e designers a colocarem em prática boas ideias. Vamos conversar?</p>
        <span> <a href="https://instagram.com/rafaballerini">Instagram</a> </span>
        <span> <a href="https://github.com/guilhermeonrails">Github</a> </span>
        <img src="Imagem.png" alt = "Foto da Joana Santos programando">
    </main>

Conteúdo CSS:

.apresentacao {
    display: flex;
    justify-content: space-between;
}

Exercício cinco) Flexbox: Centralização vertical

Conteúdo CSS:

.apresentacao {
    display: flex;
    align-items: center;
    height: 300px;
}

Exercício seis) responsividade e alinhamento

Conteúdo CSS:

.apresentacao {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
  
1 resposta

Oi, Guilherme! Como vai?

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

Gostei de como você aplicou o flexbox em diferentes situações. Sua estrutura está bem clara e os exercícios mostram que você está entendendo os conceitos, principalmente no alinhamento e uso do height: 100vh.

Continue firme nos estudos.

Alura Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!