JMiur [E]

Las unidades de longitud que se pueden utilizar en CSS nos permiten definir el tamaño de los elementos y de los textos.

Hay dos grandes grupos. Las unidades absolutas y las unidades relativas.

Las unidades absolutas sólo dependen del medio de salida (por ejemplo, una impresora) así que no son demasiado útiles:

Unidades absolutas
inpulgadas (1 pulgada = 2.54 centímetros)
cmcentímetros
mmmilímetros
ptpuntos (1 punto = 1/72 pulgada)
pcpicas (1 pica = 12 puntos)

Las unidades más utilizadas son las llamadas relativas. Se dicen relativas a algo, es decir, se miden respecto a otra cosa:

Unidades relativas
pxpixeles
emrelativa a la altura de la fuente (font)
ex relativa a la altura de la letra "x"
%porcentajes

Las posibilidades son varias aunque, por lo general, usamos tres: pixeles (px), relativas (em) o porcentajes (%).

¿Es mejor una que otra? Las opiniones varían así que no hay que hacer caso a los consejos y usar las que nos resulten más cómodas. En principio yo prefiero usar pixeles porque permite controlar cada elemento con facilidad, siempre se adaptarán a la resolución de la pantalla del usuario.

Las otras unidades relativas dependen de la altura de un elemento previamente definido, son un porcentaje de ese elemento principal por ejemplo, la fuente de texto por defecto. En principio, esa fuente tiene este valor:

font-size:1em;

un valor mayor, significa un tamaño superior:

font-size:1.5em;

un valor menor, significa un tamaño inferior:

font-size:0.5em;

Si bien no es sencillo de controlar, usar em permite crear páginas proporcionadas que no se deformarán sin importar donde las veamos.

De alguna manera, son similares a los porcentajes pero no se suelen usar para las fuentes de los textos sino en el resto de los elementos, generalemente, con las propidades width y height.

En la web hay muchas tablas de equivalencias entre las diferentes unidades, esta es sólo una más:

PuntosPixelesEm%
6pt8px0.5em50%
7pt9px0.55em55%
7.5pt10px0.625em62.5%
8pt11px0.7em70%
9pt12px0.75em75%
10pt13px0.8em80%
10.5pt14px0.875em87.5%
11pt15px0.95em95%
12pt16px1em100%
13pt17px1.05em105%
13.5pt18px1.125em112.5%
14pt19px1.2em120%
14.5pt20px1.25em125%
15pt21px1.3em130%
16pt22px1.4em140%
17pt23px1.45em145%
18pt24px1.5em150%
20pt26px1.6em160%
22pt29px1.8em180%
24pt32px2em200%

2 comentarios:

Anónimo  

¿Dónde hay good money? ¿Nadie que pase un aviso sobre dónde se consigue el asado a precio bolsillo-laburante, al menos?

Responder
JMiur  

Fuí y volví. Mi cuenta bancaria no ha sufrido cambios. Me temo que para lo del asado, hay que buscar otro enlace; tal vez milagros.com.

Responder

¿Quiere dejar un comentario?

recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

Nota: sólo los miembros de este blog pueden publicar comentarios.

Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

 
CERRAR