CSS admite múltiples unidades de longitud. Se pueden dividir en dos categorías principales: unidades de longitud absoluta (que definen la longitud en dimensiones absolutas independientemente del dispositivo de visualización); unidades de longitud relativa (que definen la longitud en relación con otras unidades conocidas por el navegador).
Las medidas de longitud absoluta se pueden medir en cinco unidades: pulgadas (in), centímetros (cm), milímetros (mm), puntos (punto, escrito como pt) y altura de carácter (pica, escrito como pc). El punto y la altura del tipo se utilizan comúnmente como unidades tipográficas, donde 1pica=12pt. CSS define 1pica como 1/72 pulg., es decir, 72 pica = 1 pulg. Esta es también la definición utilizada por el lenguaje postscript de Adobe, que suelen utilizar las imprentas de alta calidad.
CSS también admite longitudes "absolutas" en píxeles: los píxeles son un punto en la pantalla de una computadora. Sin embargo, debido a las diferencias en la densidad de píxeles y la elección del usuario de la resolución de pantalla (la misma pantalla puede admitir una resolución de 640*480 o una resolución de 1024*768), el tamaño absoluto de los píxeles variará en diferentes pantallas. . Por lo tanto, la longitud en píxeles depende en realidad de la visualización. La ventaja de utilizar píxeles como unidades de visualización de computadora es que los píxeles son unidades estrictamente definidas. Sin embargo, las unidades de píxeles pueden causar problemas al imprimir documentos web.
Las unidades de longitud absoluta, como pulgadas y centímetros, son muy útiles en el diseño de impresión porque proporcionan la posición absoluta necesaria para diseñar un documento en un papel de tamaño fijo. Es por esta razón que no se debe utilizar la longitud absoluta en documentos de visualización electrónica. Esto se debe a que la visualización será diferente entre pantallas de 6 x 4 pulgadas y 21 pulgadas de diagonal, y no hay garantía de que el navegador muestre la misma longitud en un determinado formato. visualización Los documentos se pueden mostrar utilizando un área de ventana fija (el tamaño de la ventana puede ser seleccionado por el usuario). Teniendo en cuenta tales diferencias, es apropiado utilizar unidades que se ajusten automáticamente al tamaño del área de visualización o al tamaño de fuente del texto. Afortunadamente, existen tres unidades de longitud CSS que permiten este comportamiento.
Las medidas de longitud relativa pueden presentarse en tres formas: unidades em, unidades ex y porcentaje. Las unidades em y ex definen la longitud relativa al tamaño de la fuente. La unidad em define la longitud relativa al tamaño real en puntos de la fuente: por lo tanto, si el tamaño de fuente actual es 12 puntos, entonces 1,5 em = 18 puntos. Por el contrario, las unidades ex definen la longitud relativa a la altura x de la fuente: es decir, relativa a la altura de la letra "x" en la fuente actual. De esta manera, el tamaño ex de una unidad depende tanto del tamaño de la fuente como del tipo de familia de fuentes, ya que la altura x real en un tamaño de punto determinado variará de una familia de fuentes a otra.
Actualmente, las unidades em son más confiables que las unidades ex: para obtener la mejor compatibilidad entre diferentes navegadores, es mejor usar unidades em. Pero tenga en cuenta que tanto las unidades em como ex pueden causar problemas de impresión.
La unidad porcentual es la tercera unidad relativa. Esta unidad define la longitud como un porcentaje de la longitud relativa. Según la especificación CSS, la longitud relevante es el tamaño de fuente de la unidad principal o el ancho de la unidad de formato principal; cada caso variará según las características de la pregunta. Hay una advertencia extremadamente importante: los navegadores existentes no calculan los valores porcentuales en relación con el ancho de la celda y, por lo tanto, no implementan los porcentajes de longitud correctamente. En cambio, todos los navegadores calculan el porcentaje de longitud independiente de la fuente como un porcentaje del ancho total de la ventana del navegador.
El formato del valor de longitud consta de un signo ('+' o '-', el valor predeterminado es '+') seguido de un número y luego un identificador de unidad (una abreviatura de dos caracteres). Hay dos formas de unidades de longitud: unidades relativas y absolutas. Las hojas de estilo utilizan unidades relativas para facilitar el control del escalado de un medio a otro (como de una computadora a una impresora láser). Las unidades porcentuales y los valores clave (como 'x-large') tienen las mismas ventajas. como sigue:
H1 {margen: 0,5 em} altura de fuente del elemento
H1 { margen: 1ex } La altura de la letra 'x'
en unidades de píxeles en relación con la resolución de gráficos de la pantalla. Si la densidad de píxeles del dispositivo de salida difiere significativamente de la pantalla de una computadora estándar, el usuario cambiará la escala de los valores de píxeles. El valor de píxel recomendado es 90 ppp a un brazo de distancia del lector. Los elementos secundarios heredan el valor del resultado calculado en lugar del valor relativo, como por ejemplo:
BODY {
tamaño de fuente: 12 puntos;
sangría de texto: 3em;
}
H1 { tamaño de fuente: 15pt }
En el ejemplo anterior, el valor de 'sangría de texto' de 'H1' es 36pt, no 45pt.
==================================
etiqueta em--etiqueta de énfasis
* las etiquetas em aparecen en pares, con <em >Empiece con</em>
* Propiedades:
* Común - propiedades generales
* em es la abreviatura de énfasis