Publicado em 20 de mai.

Duvida com as unidades de medida EM e REM do CSS

#css #desenvolvimento-frontend #em #html #html5

Pessoal, estou estudando sobre unidades de medidas do CSS. Estou com a seguinte duvida: Para sites responsivos, a medida EM só serve para dizer o tamanho da fonte? Posso formatar uma div em forma de caixa toda com a medida EM? No caso, essa medida fica fixa? Ou responsiva? Fiz um teste e deu que ficou fixa. Mas a EM é uma medida pra sites responsivos, então o certo não era o caixa ficar de acordo com a tela do dispositivo? ou isso fica com a porcentagem (%)? Exemplo:

<!DOCTYPE html>

<html>
 <head>
 <title>teste</title>
 <style>
 div {

 background-color: aqua;
 width: 30.8em;
 height: 30.8em;
 }
 </style>
 </head>
 <body>
 <div> </div>
 </body>
</html>

	Aqui tenho um exemplo em que a div "pai" é em % e a div filho é com a unidade EM. Nesse caso, ele não deveria pegar o valor da porcentagem do pai, e automaticamente reduzir o tamanho da div filho? Isso parece bastante com a unidade de medida PX.

<!DOCTYPE html>

<html>
 <head>
 <title>teste</title>
 <style>
 #pai {
 background-color: aqua;
 width: 100%;
 height: 100%;
 }
 #filho {
 background-color: indianred;
 width: 30.0em;
 height: 30.0em;
 }
 </style>
 </head>
 <body>
 <div id = "pai">
 <div id = "filho">
 </div>
 </div>
 </body>
</html>

	No caso, pra formatação de div's com width e height, tenho que utilizar % sempre que quiser deixar responsivo ? Se sim, isso significa que em questão de formatação de imagem o EM e REM seria praticamente a mesma coisa que o pixel? sempre ficando no mesmo tamanho independente do dispositivo como no exemplo a cima?

	Outra pergunta: O EM e REM é só pra tamanho de fontes ou da pra fazer a coisa a cima?

	Outra pergunta: Qual a unidade de medida mais utilizada hoje em dia pra sites responsivos? EM, REM ou outra melhor?

	 

	Desde já obrigado!

Discussão (4)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

Omar~· 21 de mai.

Olá Keven.

Sim dar para se formatar blocos pelo uso do EM, mas sugiro a você que use somente para textos. Porém no uso de margins e paddings em muitos casos é a melhor escolha. Prefira formatar tamanho de blocos em design responsivo com o uso do %. Sempre o pulo do gato em design responsivo será o media-query.

Pelo menos é essa a minha experiência com em uso em EM

keven1406· 21 de mai.

5 horas atrás, OmarF disse:

Olá Keven.

Pelo menos é essa a minha experiência com em uso em EM

Obrigado por responder. Então deixo os textos com o EM e os blocos com o % + media-query. Vejo muita gente falando em usar o Bootstrap e outros frameworks por ae. No entanto estou começando a estudar o media-query agora. No caso, é melhor eu ir estudando responsividade como estou fazendo agora, sem o uso do bootstrap? Vejo que tem gente que utiliza o bootstrap só pra pegar os grids e abandonam todo o resto dele. Se eu aprender a usar o media-query e aprender a fazer meus próprios grids, o bootstrap fica dispensável? Em questão de entrar no mercado (Estou louco pra ganhar dinheiro com isso. Faz 7 meses que estudo já o.o) sou obrigado a aprender o Bootstrap?

Omar~· 21 de mai.

3 minutos atrás, keven1406 disse:

Estava a responder um tópico meu quando vi a notificação.

Então... Não, você não é obrigado a aprender a usar o bootstrap, mas não deixe de aprender a usar-lo que, pode ser útil dependendo do trabalho que vá fazer.

Meu conselho é que esqueça de qualquer framework pelo por enquanto e só venha a usar quando souber caminhar com as próprias pernas, ou seja fazer tudo na mão por conta própria e não pegar algo mastigado e engolir se que me entende.

Já vi isso várias vezes acontecer de uma pessoa só aprender a suar tal coisa e quando o "bixo" pega pro lado dele ele não sabe o que fazer.

Mas enfim, como disse e acho que todo dev concordaria comigo.

- E porque então eu deveria aprender a usar o bootstrap se sei fazer por mim mesmo?

Simplesmente que um client possa vim a você e querer algo específico sendo feito com o bootstrap.