como deixar esse site responsivo?
biografia.css (2,7,KB) biografia.html (1,5,KB)
Vamos lá, não é sempre que faço isso:
O segredo pra vc fazer um layout responsivo, é deixar ele centralizado, ainda mais quando se trata de um portfolio.
Outra coisa também que CONTA MUITO são as imagens, se vc tratar a imagem antes de usar, arrumar o tamanho, remover o fundo (quando se trata da sua foto) ajuda demais.
Problemas Encontrados:
-
Header (Vc só colocou seu nome e uma foto enorme sua (?)), o ideial é colocar um Logo (seu nome no caso), e alguns links:
<header> <div class="informacao"> Geovane Santana<br> <div id="desenvolvedor"> desenvolvedor </div> </div> <h1>olá<img src="Geovane (1).png"></h1> </header>
-
Como já mencionado, a falta de alinhamento
-
e também uma falta de textos, o único que tinha era sobre vc…
É legal trabalhar com cores também, qualquer corzinha já dá uma diferença enorme no site, olha como eu deixei:
//Com um box shadow nas suas habilidades:
biografia.html (3,7,KB) biografia.css (4,2,KB)
Segue os arquivos, e o site
Espero que vc entenda que não estou te desmerecendo ou dizendo coisas ruins pra vc, apenas apontei algumas coisas que poderiam ser melhoradas.
Outra coisa bem legal é fazer isso:
é tudo pra encher linguiça no final, mas que dá uma enorme diferença.
HTML
<div class="hero-div">
<p id="title-hero">Design & Dev duo in Brazil</p>
<p id="desc-1">We help companies and startups shipping</p>
<p id="desc-2">amazing website</p>
</div>
CSS
.hero-div {
display: flex;
justify-content: center;
flex-direction: column;
text-align: center;
margin: auto;
width: 100%;
height: 700px;
background: linear-gradient(rgba(29, 30, 36, 0.9), rgba(29, 30, 36, 0.9)),
url('https://images.unsplash.com/photo-1498050108023-c5249f4df085?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1352&q=80');
background-position: center;
background-size: cover;
overflow-x: hidden;
position: relative;
align-items: center;
}
Ficou fera mesmo, só de ter colocado as cores já deu outra cara. Não vejo a hora de chegar nesse nível!
Opa, valeu!! Hoje é seu dia de sorte então, pq o meu nível tá bem baixo kkkkkkk
valeu cara mais eu achei mais legal do outro jeito!
Não tem problema, eu só fiz o site pra vc ter uma noção de como fazer o site ficar responsivo. Agora é só aplicar pra o seu uso
as intendi mesmo assim muito obrigado!