4
respostas

exercicio

Home Sobre mim Desenvolvido por Joana Santos © 2025
4 respostas

/* 1) Estilizando o cabeçalho */
.cabecalho {
background-color: #000000;
padding: 24px;
}

.cabecalho__menu {
display: flex;
justify-content: center;
gap: 32px;
}

.cabecalho__menu__link {
font-family: 'Montserrat', sans-serif;
font-size: 18px;
color: white;
text-decoration: none;
padding: 8px 16px;
transition: color 0.3s ease;
}

.cabecalho__menu__link:hover {
color: #22D4FD;
}

/* 2) Ajuste do padding da apresentação */
.apresentacao {
padding: 5%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
gap: 80px;
}

/* 3) Comentado o height que atrapalhava o layout /
/
body {
height: 100vh;
} */

body {
margin: 0;
font-family: 'Montserrat', sans-serif;
background-color: #000000;
color: white;
}

/* Estilos dos links com ícones (Github, LinkedIn, Twitch) */
.apresentacao__links__link {
display: flex;
justify-content: center;
align-items: center;
gap: 16px;
padding: 16px 24px;
text-decoration: none;
font-family: 'Montserrat', sans-serif;
font-weight: 600;
background-color: #000000;
color: white;
border-radius: 8px;
transition: all 0.3s ease;
}

.apresentacao__links__link:hover {
border: 2px solid #0000FF;
background-color: #272727;
cursor: pointer;
}

/* Rodapé personalizado */
.rodape {
background-color: #22D4FD;
color: #000000;
text-align: center;
font-family: 'Montserrat', sans-serif;
font-size: 24px;
font-weight: 400;
padding: 24px;
}

Boa tarde Vanessa!

Legal, continue assim!

Boa, é isso ai!!! continue e não perca o foco!!!
HTML & CSS, como qualquer outra ferramenta, só aprende praticando!!!