Las unidades de medida nos ayudaran a establecer tamaños a los elementos o tipografias de nuestro html, existen dos tipos de unidades de medida:
– Unidades de medida absoluta: son unidades fijas que no cambiaran ya que tienen establecido un tamaño por defecto.
a. 1mm(milimetro) = 0.1cm.
b. 1cm(centrimetro) = 0.01m.
c. 1in(pulgada) = 2.54cm = 96px.
d. 1px(pixel) = 0.026cm.
e. 1pt(punto) = 1/72in = 0.035cm.
f. 1 pc(pica) = 1/6 in = 0.42cm.
– Unidades de medida relativa: son unidades variables y que dependen del tamaño de un valor externo, un padre que posea una medida absoluta.
a. em = se basa en el tamaño de la fuente del elemento padre, generalmente los elementos tienen un font-size de 1em = 16px.
b. rem = es similar al “em”, pero depende del valor externo del padre que sería el documento html y afectara a todas las unidades rem del documento, el documento tiene un font-size de 1rem = 16px, pero se puede hacer regla de 3 para hacer uso de rem más facil, (100%*10px)/16px = 62.5% y así cada 1rem = 1px.
c. vw(viewport width) = representa el tamaño de anchura que es visible de la ventana gráfica, 50vw es igual al 50% de la anchura visible.
d. vh(viewport height) = representa el tamaño de altura que es visible de la ventana gráfica, 50vh es igual al 50% de la altura visible.
e. vmin = representa el valor mínimo entre el ancho y el alto del viewport.
f. vman = representa el valor máximo entre el ancho y el alto del viewport.
g. ch = una unidad de medida que representa el ancho del carácter “0” en la fuente utilizada.
h. lh(line height) = Es una unidad de medida que se utiliza para establecer la altura de línea en relación con el tamaño de la fuente del elemento, 1.5lh = 150% del tamaño de la fuente del elemento.
