1
resposta

[Projeto] Desafio : Mão na massa

1. Espaçamento e margens com Flexbox CSS

.inicio{
    margin: 12%;
    display: flex;
    align-items: center;
    justify-content: space-between;

}

2. Definindo o tamanho da seção de texto CSS

.apresentacao__conteudo{
    width: 270px;
}

3, 4 e 5. Ajustando tamanhos de títulos e textos

/*Parte HTML*/
<!DOCTYPE html>
  <html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Mão na massa</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <main class="inicio">
      <section class="apresentacao__conteudo"></section>
      <h1 class="apresentacao__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="apresentacao__texto">Olá! Sou Fernando Marques, desenvolvedor 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>
      <img src="https://th.bing.com/th/id/OIG4.fWFPUxnQvfa0HkciIbmJ?w=173&h=173&c=6&r=0&o=5&pid=ImgGn" alt="capa">
    </main>
</body>
</html>

/*Parte CSS */

@import url('https://fonts.googleapis.com/css2?family=Krona+One&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

* {
    margin: 0;
    padding: 0;
    background-color: #000000;
    color: #ffffffff;
}

body{
    height: 100vh;
    box-sizing: border-box;
    background-color: #000000;
    color: #F6F6F6;
}

.titulo-destaque{
    color: #22D4FD;
}

.inicio{
    margin: 12%;
    display: flex;
    align-items: center;
    justify-content: space-between;

}
.apresentacao__conteudo{
    width: 615px;
}


.apresentacao__conteudo__titulo{
    font-family: "Krona One", sans-serif;
    font-size: 33px;
}

.apresentacao__texto{
    font-family: "Montserrat", sans-serif;
    font-size: 18px;
}
1 resposta

Oi, Luiz, tudo bem?

Parabéns pelo resultado, ficou ótimo! Também agradeço por compartilhar seu projeto, com certeza vai ajudar nos estudos de todas as pessoas que estão aprendendo este mesmo assunto.

Continue mergulhando em tecnologia e se tiver dúvidas, conte com o fórum.

Abraços e bons estudos!