1
resposta

Desafio: crie uma página currículo!

Gostaria de esta compartilhando com vcs o desafio do Currículo ![](Insira aqui a descrição dessa imagem para ajudar na acessibilidade ) html

<!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>Curriculo</title>
    <link rel="stylesheet" href="./styles/style.css">
</head>
<body>
    <header class="cabecalho">
        <nav class="cabecalho__menu">
            <a class="cabecalho__menu__link" href="trabalho.html">Home</a>
            <a class="cabecalho__menu__link" href="about.html">Sobre mim</a>
            <a class="cabecalho__menu__link" href="curriculo.html">Curriculo</a>
        </nav>
    </header>
    <main class="apresentacao">
        <section class="apresentacao__conteudo__curriculo">
        <h1 class="apresentacao__conteudo__titulo__curriculo"><strong class="titulo-destaque">Curriculo</strong></h1>
        <P class="apresentacao__conteudo__texto">
            Brasileiro - 2005.
            E-mail: Ricardopnayder@gmai.com <br>
            Contato: (11) 96277xxxx </p>
            <h2 class="apresentacao__conteudo__titulo__h2">Habilidades</h2>
            <P class="apresentacao__conteudo__texto">Confiável e atencioso, Boa Capacidade de Comunicação e
                Trabalho em Equipe, Flexibilidade e capacidade de se adaptar
                a mudanças</P>
            <h2 class="apresentacao__conteudo__titulo__h2">Experiência</h2>
            <P class="apresentacao__conteudo__texto">Possuo pouca experiência, porém tenho facilidade e
                agilidade em novos aprendizados</P>
            <h2 class="apresentacao__conteudo__titulo__h2">Cursos</h2>
            <P class="apresentacao__conteudo__texto">
                HTML e CSS: Classes, posicionamento e Flexbox - carga horária 8h <br>
                HTML e CSS: ambientes de desenvolvimento, estrutura de arquivos e tags - carga horária 8h <br>
                Cursando Alura
            </P>
        </section>
        <img src="./assets/Ricardo.png" alt="Foto do Ricardo Nayder">
    </main>

    <footer class="rodape">
        <p>Desenvolvido por Ricardo Nayder.</p>
    </footer>
</body>
</html>

Css

@import url('https://fonts.googleapis.com/css2?family=Krona+One&family=Montserrat:wght@400;600&display=swap');

*{
    margin: 0;
    padding: 0;
}

body{
    /* height: 100vh; */
    box-sizing: border-box;
    background-color: #011F26;
    color: #A5A692;
}
.cabecalho{
    padding: 2% 0% 0% 15%;
}

.cabecalho__menu{
    display:flex;
    gap: 80px;
}

.cabecalho__menu__link{
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 600;
    color: #F2A71B;
    text-decoration: none;

}

.apresentacao{
    padding: 5% 15%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.apresentacao__conteudo{
    width: 615px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.apresentacao__conteudo__curriculo{
    width: 615px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    
}

.apresentacao__conteudo__titulo{
    font-size: 36px;
    font-family: 'Krona One', sans-serif;
}
.apresentacao__conteudo__titulo__curriculo{
    font-size: 36px;
    font-family: 'Krona One', sans-serif;
}
.apresentacao__conteudo__titulo__h2{
    font-size: 25px;
    font-family: 'Krona One', sans-serif;
}

.titulo-destaque{
    color: #F2A71B;
}

.apresentacao__conteudo__texto{
    font-size: 24px;
    font-family: 'Montserrat', sans-serif;
    padding: 0% 0% 0% 0%;
}

.apresentacao__links{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    gap: 32px;
}

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

.apresentacao__links__link{
    /* background-color: #22D4FD; */
    display: flex;
    justify-content: center;
    gap: 16px;
    border: 2px solid #F2A71B;
    width: 378px;
    text-align: center;
    border-radius: 8px;
    font-size: 24px;
    font-weight: 600;
    padding: 21.5px 0;
    text-decoration: none;
    color: #A5A692;
    font-family: 'Montserrat', sans-serif;
}

.apresentacao__links__link:hover{
    transform: scale(1.1);
    box-shadow: 0 0 15px #f2a71b6c;
    background-color: #f2a71b6c ;
}

.rodape{
    padding: 24px;
    color: #011F26;
    background-color: #F2A71B;
    text-align: center;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 400;
}
1 resposta

Oi, Ricardo, 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!