Unidades absolutas
Pixel (px), centímetro (cm) y puntos (pt).El px varía de un sistema operativo a otro; en Windows se representan 96px por pulgada, mientras que una Mac utiliza 72px por pulgada.
En cuanto a la utilización de pt depende de la resolución de pantalla del usuario.
Si bien el diseñador obtiene un control "exacto" del diseño, utilizar estas unidades le quita accesibilidad al sitio.
Unidades relativas
En la lista de recomendados, la misma la encabeza la unidad em.Un em es la distancia equivalente al ancho de la letra m mayúscula; el ancho de dicha letra es que el que está definido por defecto en el navegador.
Así, cuando el tamaño por defecto sea de 16px una medida de 1.5em representará una fuente de 24px.
<style type="text/css">
body {
font-size: 100%;
}
h1 {
text-size: 1.5em;
}
#contenido {
text-size: .85em;
width: 30em;
background-color: #FFFFFF;
}
</style>
Esto es el principio de los diseños elásticos, principalmente cuando los divs, por ejemplo, son declarados con este método.
Para quien necesite llevar a cabo las conversiones de px a em pueden utilizar el Em Calculator
Em Calculator es una pequeña herramienta en JavaScript la cual ayuda a realizar diseños CSS escalables y accesibles. Convierte de pixel a una unidad relativa como em, basada en el text-size.
0 comentarios:
Publicar un comentario