Al principio no entendía muy bien qué era “em”, pero ahora veo que es como una medida que se adapta al entorno. Usar unidades relativas como em y rem no solo mejora la accesibilidad, también nos ayuda a crear proyectos más inteligentes y responsivos.
¡Hola Estudiante, espero que estés bien!
Me alegra que estés explorando el uso de unidades relativas como em y rem en CSS, ya que son herramientas poderosas para crear diseños más accesibles y responsivos. Como mencionaste, em es una unidad relativa que se adapta al entorno, específicamente al tamaño de fuente del elemento padre.
Para darte un ejemplo práctico, si tienes un elemento con un font-size de 20 píxeles y dentro de este elemento usas 1em, el tamaño de fuente será de 20 píxeles. Si usas 0.5em, será de 10 píxeles, ya que es la mitad del tamaño del elemento padre.
Sin embargo, es importante tener en cuenta que el uso de em puede complicarse cuando tienes varios niveles de anidación, ya que cada nivel se basa en el tamaño de fuente de su elemento padre inmediato. Esto puede hacer que el cálculo del tamaño final sea un poco complicado, como se explica en el contexto de tu curso.
Por eso, en situaciones donde el cálculo se vuelve complejo, muchas veces se prefiere usar rem, que es similar a em, pero siempre se basa en el tamaño de fuente raíz del documento (normalmente el tamaño de fuente del elemento <html>). Esto hace que los cálculos sean más predecibles y fáciles de manejar.
Espero que este ejemplo te ayude a entender mejor cómo funcionan las unidades em y cuándo podrías considerar usar rem en su lugar. ¡Espero haber ayudado y buenos estudios!