Gostaria de saber um bom vídeo ou artigo explicativo sobre as principais diferenças entre essas duas unidades de medidas e quando usá-las, pois foi a parte que menos entendi ao longo dos cursos =/. Agradeço!
Gostaria de saber um bom vídeo ou artigo explicativo sobre as principais diferenças entre essas duas unidades de medidas e quando usá-las, pois foi a parte que menos entendi ao longo dos cursos =/. Agradeço!
Talvez esse artigo possa te ajudar de forma descomplicada https://pingback.com/papodedev/css-rem-vs-em-vs-px-qual-usar
Mas basicamente a diferença é: REM pega o tamanho do font-size da tag HTML enquanto que o EM pega o tamanho do font-size da tag pai.
Exemplo:
<html style="font-size:20px">
<body>
<div style="font-size:10px">
<p id="id1" style="font-size:2rem">Texto 1</p>
<p id="id2" style="font-size:2em">Texto 2</p>
<p id="id3" style="font-size:40px">Texto de 40px</p>
<p id="id4" style="font-size:20px">Texto de 20px</p>
</div>
</body>
</html>O tamanho do texto em <p id="id1"> será de 2REM = 2*(font-size do HTML) = 2*20 = 40 px.
O tamanho do texto em <p id="id2"> será de 2EM = 2*(font-size do elemento pai) = 2*10 = 20 px.