Respuestas
Respuesta:
Las medidas en CSS se emplean, entre otras, para definir la altura, anchura y márgenes de los elementos y para establecer el tamaño de letra del texto.
...
3.1.1. Unidades absolutas
in , pulgadas ("inches", en inglés). Una pulgada equivale a 2.54 centímetros.
cm , centímetros.
mm , milímetros.
pt , puntos. ...
pc , picas.
Respuesta:
Se dividen entre
Unidades Absolutas
Unidades Relativas
Explicación:
1. Unidades absolutas
Como su nombre lo indica, son unidades que están completamente definidas. Esto quiere decir que su valor no depende de otro valor de referencia. En este grupo encontramos los siguientes elementos:
cm: Aumenta el tamaño de nuestro texto o elemento en centímetros
mm: Aumenta el tamaño de nuestro texto o elemento en milímetros
in: Aumenta el tamaño de nuestro texto o elemento en pulgadas (1in = 96px = 2.54cm)
px: Aumenta el tamaño de nuestro texto en pixeles (Dependiendo del dispositivo, este elemento se clasifica también en Unidades Relativas. Aunque también depende de la versión de CSS que se maneje)
pt: Aumenta el tamaño de nuestro texto en puntos (1pt = 1/72 de 1in)
pc: Aumenta el tamaño de nuestro texto en picas (1pc = 12 puntos aprox)
Ya que el pixel es una de las unidades absolutas más utilizadas, realizaremos un ejemplo: CSS: h1 {font-size: 50px;} HTML: <h1>Medidas en CSS3</h1> RESULTADO:
Unidades relativas
Este tipo de unidad es más flexible y se expresa en forma de porcentaje (%). Me refiero a su flexibilidad porque se adapta de acuerdo al tamaño de otro valor de referencia. Por ejemplo, en el mundo real tu hermano y tú tienen dos balones de futbol. Un balón es grande y el otro es pequeño, pero a cada uno le corresponde la mitad de cada uno de esos balones (50%). No importa el tamaño del balón, porque igual siempre vas a ser dueño del 50%. Entonces, si el balón grande redujera su tamaño, igual tendrías el 50% de este. Ahora aplica este ejemplo a los distintos tipos de resolución de pantalla. Ahora bien, las unidades relativas se subdividen en 2 grupos:
1. Relativas a la tipografía
2. Relativas al viewport
Relativas a la tipografía
em: Relativo al tamaño de fuente de un elemento. Si, por ejemplo, utilizamos 3em (font-size: 3em); mi texto aumentará 3 veces su tamaño en relación al tamaño que se esté utilizando por defecto.
ex: Aumenta el tamaño de mi letra en cuanto a su altura.
Rem: Es igual a (em) con la diferencia de que este actúa en la raíz. O sea, en la letra que esté utilizando por defecto.
Relativas al viewport - ventana
vw: Porcentaje relativo a la anchura del viewport.
vh: Porcentaje relativo a la altura del viewport.
vmin: Entre vw y vh toma el que tenga menor valor.
vmax: Entre vw y vh toma el que tenga mayor valor.