Unidades de medida CSS

Hola a todos hoy os explicare las unidades de medida de CSS aplicándolos a ejemplos.

Las medidas en CSS se usan para definir la altura, anchura y márgenes de los elementos y del  tamaño de las letras.

Se indican con un valor numérico seguido de una unidad de medida.

– Unidades relativas:

Son unidades de medida que dependen de su referencia.

Las unidades relativas son:

• em: es relativa respecto del tamaño de letra empleado. 1em es la anchura de la letra M mayúscula del tipo de letra que se está utilizando. Puede usar decimales.

• ex: es relativa respecto de la altura de la letra x minúscula del tipo de letra que se esté utilizando. Puede usar decimales.

• px: es relativa respecto de la pantalla del usuario. No puede usar decimales.

– Unidades absolutas:

Son unidades de medida que tienen unos valores determinados.

Las unidades absolutas son:

• in: pulgadas (1 pulgada=2.54 cm)
• cm: centimetros
• mm: milímetros
• pt: puntos (1 pt= 0.35 mm)
• pc: picas (1 pica=4.23 mm)

– Porcentajes:

 Es relativa  respecto al tipo de unidad de medida usada. Si usamos una unidad relativa, también le afectara.

Por ejemplo, supongamos que asignamos a la etiqueta body un font-size de 100px y hacemos un selector de clase con otra regla con otro font-size de 50% y se lo aplicamos a un párrafo. Veremos que las letras de un párrafo serán más grandes que otro.

Espero que os sea de ayuda.