sábado, 18 de septiembre de 2010

Tabla de equivalencias css

Por preguntas realizadas por la entrada anterior con respecto al tamaño de las fuentes, agrego una tabla.


Esta tabla es para ver las diferencias entre pt, px, em y %.

Es una aproximación, que dependerá de la fuente, el navegador y sistema operativo.

Tener en cuenta el tamaño de la fuente padre en el cuerpo del diseño, sobre todo si utilizamos porcentaje.


PT (puntos): Valor en puntos.

PX (píxel): Significa pixeles y es un punto de la pantalla.

EM (M): Es una medida tipográfica que equivale al ancho de la letra eme.

% (porcentaje): Si un padre tiene como tamaño de fuente 20px y el hijo posee un tamaño de 50%, este tendrá un tamaño final de 10px.


Si se establece el tamaño de letra al elemento <body>, todos los elementos de la página tendrán el mismo tamaño de letra, salvo que indiquen otro valor.

body { font-size: 10px; }
h1 { font-size: 2.5em; }
h2 { font-size: 150%; }

En primer lugar, se establece un tamaño de letra base de 10 píxel para toda la página. A continuación, se asigna un tamaño de 2.5em al elemento <h1>, por lo que su tamaño de letra real será de 2.5 x 10px = 25px. Después asignamos un porcentaje al elemento <h2>, por lo que su tamaño de letra real será de 1.5 x 10px = 15px.

Les recomiendo leer acá:

No hay comentarios:

Publicar un comentario