Unidades de medida en CSS - Longitudes absolutas y relativas

Las medición de las unidades son expresadas bajo abreviaturas en: in, cm, mm, pt y pc para longitudes absolutas. Y em, ex y % para relativas.

Unidades de medida en CSS - Longitudes absolutas y relativas | Aprender CSS | Las medición de las unidades son expresadas bajo abreviaturas en: in, cm, mm, pt y pc para longitudes absolutas. Y em, ex y % para relativas
COMPÁRTELO:

Las medidas de longitud se pueden expresar en valores numéricos positivos o negativos.

Aunque hay que tener en cuenta que determinadas propiedades sólo se aceptan valores positivos. El valor en sí suele indicarse, generalmente, junto con una unidad. La unidad viene inmediatamente a continuación del valor (sin espacio en blanco), expresada, por regla general, mediante abreviatura de una o dos letras, por ejemplo mm para milímetros o px para pixeles.

Constituye una excepción las propiedades que admiten valores numéricos sin indicación de unidad, por ejemplo z-index (describe una posición en el eje de coordenadas Z) o line-height (describe un factor). Tampoco al valor 0 (cero) es necesario añadirle ninguna unidad.

Es muy importante distinguir entre valores de longitud absoluta y relativos. Las unidades absolutas indican siempre  una longitud fija, mientras que con las relativas la longitud se calcula siempre con relación a otros elementos.

Entre las unidades absolutas están la pulgada (in), el centímetro (cm), el milímetro (mm), el punto (pt) y la pica (pc). No es nada aconsejable utilizar unidades absolutas ya que su transmisión al monitor u otros dispositivo resulta, cuando menos vaga. La mayor desventaja, no obstante, es que, en muchos casos, el usuario no puede influir en esos valores (también en función del navegador). Por ejemplo, los tamaños de fuente definidos con valores absolutos normalmente no se pueden modificar.

Entre las unidades relativas se encuentran:

  • La altura EM (em).

El tamaño de fuente del elemento.

  • La altura X (ex)

El tamaño de fuente relativo a x de la fuente definida.

  • El pixel (px)

Datos de longitud y anchura referentes a la resolución de pantalla; no es aconsejable el pixel como unidad, ya que los 96 dpi (o ppp) declarados por la norma CSS muy pocas veces se cumplen. Por eso, el tamaño de un pixel puede variar considera considerablemente en función del tamaño y la resolución del monitor. Además, las longitudes indicadas en esta unidad no se pueden escalar.

Algunas propiedades también aceptan valores porcentuales (%). En ese caso hay que fijarse bien a qué elemento se refiere el cálculo correspondientemente, por ejemplo, al elemento inmediatamente superior, o a la superficie visible de la pantalla (Viewport).

En la práctica, las unidades que mejor resultado han dado son las EM y las porcentuales. Son más fiables y calculables. El uso de EM es más flexible, ya que permite indicar también valores decimales (por ejemplo 2.75em), mientras que los valores porcentuales, o sus fracciones, resultan difíciles de calcular.

🤖

ChatGPT Gratis
Realiza preguntas sobre cualquier tema

¡Participa!

¡Compártelo en tus Redes Sociales!
Compartir en:

CITAR ARTÍCULO


Para tareas, investigaciones, tesis, libros, revistas, blogs ó artículos académicos

Referencia en Formato APA:

Delgado, Hugo. (2014).
Unidades de medida en CSS - Longitudes absolutas y relativas.
Recuperado 28 de marzo, 2024, de
https://disenowebakus.net/medidas-y-unidades-en-css.php

Profesor en la Universidad de Guadalajara

Hugo Delgado Desarrollador y Diseñador Web en Puerto Vallarta

Profesional en Desarrollo Web y Posicionamiento SEO desde hace más de 15 años continuos.
Contamos con más de 200 constancias y reconocimientos en la trayectoria Académica y Profesional, incluidos diplomados certificados por Google.

CONTINÚA APRENDIENDO

Menú categoría


Aprender CSS

TAMBIÉN MERECE LA PENA VISITAR:

¿Te gustaría aprender más sobre Diseño Web?

Conoce todos los cursos y tutoriales que tenemos para ti completamente gratis
Aprender Diseño Web

¿Todavía no encuentras lo que necesitas?

Usa nuestro buscador interno para descubrir más información
Contenido relacionado:

1 Comentario en "Unidades de medida en CSS - Longitudes absolutas y relativas"

  1. Avatar usuario
    Jose

    Las medidas de longitud se pueden expresar en valores numéricos positivos o negativos.

 

Deja tu Comentario

PATROCINADOR

Tu negocio también puede aparecer aquí. Más información
Anunciate aquí

Tu navegador ha bloqueado la publicidad.
Por favor 🙏 permite visualizar los anuncios para poder acceder, gracias.