¿Cómo convierto el interlineado y el interletraje expresados ​​en estilos CSS?

Recibí una guía de diseño/estilo para un sitio web que tiene las fuentes expresadas en medidas de puntos (pt) y ajustes adicionales de interlineado e interletraje, por ejemplo, fuente de 40 puntos, interlineado de 60 puntos, interletraje de -30 puntos.

Me gustaría usar em, en lugar de pt o px en el CSS, y asumo (usando restablecer) un tamaño de fuente base de 16px. Puedo hacer la conversación sobre el tamaño de fuente central, pero no sé qué hacer con el interlineado y el interletraje.

(PD: sé que esto significa que la fuente se representará de manera diferente en diferentes dispositivos/navegadores, solo necesito un lugar para comenzar).

[ACTUALIZACIÓN: he creado un documento de Google con la conversión de pt a px/em]

Respuestas (1)

Kerning equivale a.class { letter-spacing: Xem; }

Liderar equivale a.class { line-height: Xem; }

use exactamente la misma conversión que está usando para el tamaño de fuente para obtener los valores em correctos. 1 punto = 1 píxel

Volviendo a esto v. tarde en el día (y publique un curso de tipografía), el kerning se relaciona específicamente con pares de letras (por ejemplo, AW, AY, etc.) y es distinto del 'seguimiento', que se relaciona con el espacio entre letras en general. El estilo CSS 'letter-spacing' se refiere al 'seguimiento' y no al 'kerning', que no es manejable directamente en CSS. Hay bibliotecas JS para ayudar con esto, y un estilo CSS no muy bien soportado {text-rendering: optimizeLegibility;}que permite que el navegador se optimice solo.
word-spacingequivale a rastrear.
Tracking[1] es el espacio entre caracteres, no palabras. De acuerdo con la definición formal de espaciado entre palabras y letras[2], lo que hace que el espaciado entre letras sea equivalente al seguimiento. [1] adobe.com/uk/type/topics/glossary.html#tracking [2] w3.org/TR/CSS2/text.html#spacing-props