4
respuestas

Significado de rem

durante el curso me surgio la duda de donde y como implementar la propiedad etiqueta rem y en que la diferencia a px, gracias

4 respuestas

Hola Tyrone, en los primeros videos se explica porque se utiliza el rem y que significa

La unidad de medida rem es muy similar a em, con la única diferencia de que no es escalable, esto quiere decir que no depende del elemento padre, sino del elemento raíz del documento, el elemento HTML. Rem significa «Root Em«, o sea, es un em basado en la raíz.

Esta unidad de medida es recomendable para aplicar a elementos del layout que requieran medidas fijas y eventualmente también para textos que deseemos que tengan un tamaño de fuente que no dependa de su elemento padre.

Un ejemplo para no usar pixeles deberíamos usar algo como lo siguiente:

.container {
    margin: 0 auto;
    width: 90%;
    max-width: 75rem;
}

Para poder convertir una medida de pixeles a rem solo tienes que multiplicar el tamaño que quieres obtener por el número 0.0625, eso te dará el tamaño que debes usar en rem. Así es como se puede definir que 75rem es igual a 1200px:

75rem = 1200px x 0.0625

| REM| | Pixeles| | -------- | -------- | | 0.5 rem | 8px | | 1 rem | 16px | | 2 rem | 32px | | 3 rem | 48px |

de donde sale esos valores de rem como: fot size_ 3.1875rem ?

3.1875rem saldría de:

51px * 0.0625= 3.1875rem

Pasarías pixeles a rem, es lo que entendí, por cierto muchas gracias al compañero por la explicación de esta conversión fue de gran ayuda .