Quelle est l'unité de taille de police em? Combien est-il en pixels?
Je veux savoir ce qu'est l'unité em, et combien 1em est converti en pixels (px). J'ai également lu quelque part un bug IE, pour surmonter la taille de police du corps qui devrait être définie sur quelque chose, mais je ne pouvais pas suivre grand-chose. Quelqu'un peut-il expliquer cela en détail?
Malgré ce que vous pouvez lire ailleurs, il n'y a aucune relation directe entre em et px.
Comme l'indique l'un des liens:
la valeur "em" est basée sur la largeur du M majuscule
Cela va donc être différent pour chaque police. Une police étroite peut avoir la même hauteur (en px) qu'une police étendue, mais la taille em sera différente.
MODIFIER trois ans plus tard:
Il y a maintenant beaucoup de sources qui disent que 1em = taille de police (en px). Autrement dit, lorsque vous écrivez font-size:16px, puis 1em = 16px. Cela ne correspond toujours pas à la source Adobe (qui indique 1em = la taille de la police dans pt), mais dans les deux cas, cela semble bizarre; la taille em serait beaucoup trop grande avec des polices condensées et beaucoup trop petite avec des polices étendues.
Je vais faire quelques pages de test et voir par moi-même.
Et aussi:
Je vois que personne (y compris moi) n'a réellement répondu à la question (qui était plutôt cachée):
J'ai aussi lu quelque part quelque chose comme un bug et pour surmonter cette taille de police de corps définie à quelque chose
Selon cette page , vous devez l'ajouter à votre css: html{ font-size:100%; }. Cette page a six ans, et je n'ai pas lu les (centaines) de commentaires, donc je ne sais pas si elle est toujours pertinente.
Le principe M selon lequel un em est basé sur la lettre M et dépend de la police est un mythe souvent énoncé !! documentation em W3c décrit très succinctement comment les ems et les pixels sont liés. L'utilisation de la lettre M pour calculer les tailles de police est à tout le moins trop compliquée et inutile.
L'unité "em" est égale à la valeur calculée de la propriété "font-size" de l'élément sur lequel elle est utilisée. L'exception est lorsque "em" apparaît dans la valeur de la propriété "font-size" elle-même, auquel cas il fait référence à la taille de police de l'élément parent. Il peut être utilisé pour des mesures verticales ou horizontales.
Voici les points saillants.
Sans grossissement d'ancêtre, 1em est exactement égal à l'attribut de taille de police de pixel.
Le grossissement des ancêtres avec x-ems ou x-pourcent signifie que vous multipliez simplement par les ratios évidents x ou x/100. Ainsi, une simple boucle de script Java calculera les tailles de police exactes, en supposant: (1) aucun C.S.S pour frustrer le script Java; et (2) un ancêtre a sa taille de police définie en unités absolues. Il s'agit de la valeur calculée dont parle la documentation. Un calcul manuel peut contourner C.S.S., mais une unité absolue doit toujours être trouvée dans la chaîne des ancêtres.
Comme les ems mesurent la largeur, vous pouvez toujours calculer la taille exacte de la police en créant un div de 1000 ems de long et en divisant sa propriété de largeur du client par 1000. Comme les ems sont arrondis au millième le plus proche, vous avez besoin de 1000 ems pour éviter une troncature de pixels erronée.
Vous pouvez probablement créer une police où le principe M échoue car em est basé sur l'attribut size-size et non sur la police réelle. Supposons que vous ayez une police bizarre où M est 1/3 de la taille des autres caractères et que vous avez une taille de police de 10 pixels. Ne pensez-vous pas que la taille de police des pixels garantit en quelque sorte la hauteur maximale des caractères et que le M ne sera donc pas de 10 pixels et tous les autres caractères de 30 pixels?
Avertissement
- Une mise en garde majeure pour (2) est que le rapport relatif de l'unité ex est très instable. Dans le même navigateur avec une police constante, le rapport relatif peut changer avec la taille de la police. Le rapport relatif de ex change également avec le navigateur, même avec la même taille de police et la même police sécurisée comme la Géorgie. C'est une très bonne raison de ne jamais utiliser l'ex-unité si vous voulez la conformité. Si l'unité ex est utilisée, il est impossible de calculer la taille de la police via la chaîne des ancêtres.
Il est calculé quelle que soit la taille de la police de votre corps. Vous pouvez utiliser un convertisseur pixel en em pour savoir exactement de quoi il s'agit sur votre site.
em est une mesure utilisée à l'origine dans la typographie imprimée (selon wikipedia). Voici quelques éléments à considérer: si em est défini comme type 12pt, alors un em fait 12/72 pouces d'une page imprimée; mais si vous définissez un em comme 16px, sa largeur en pouces dépend de la résolution du support. (Remarque: la résolution de 72 ppp à 120 ppp était considérée comme une norme de "navigateur sûr" avant l'avènement des appareils mobiles.) Ainsi, lorsque vos utilisateurs utilisent un appareil de 300 pixels de large, 1em comme 16 pixels représente beaucoup de "biens immobiliers". La meilleure utilisation des mesures em, à mon avis, est de définir des paragraphes de textes pour équilibrer efficacement les espaces blancs, pas pour la mise en page ou le positionnement des pages.
Nommé d'après la lettre "M", l'unité em a une longue tradition dans la typographie où il a été utilisé pour mesurer des largeurs horizontales. Par exemple, le long tiret souvent trouvé dans les textes américains (-) est connu comme "em-dash" car il a historiquement eu la même largeur que la lettre "M". Son cousin plus étroit (-), souvent trouvé dans les textes européens, est également appelé "en-dash".
La signification de "em" a changé au fil des ans. Toutes les polices n'ont pas la lettre "M" (par exemple chinois), mais toutes les polices ont une hauteur. Le terme signifie donc la hauteur de la police et non la largeur de la lettre "M".
Extrait de "The amazing em unit and other best practices" https://www.w3.org/WAI/GL/css2em.htm
EM est une unité de mesure proportionnelle à la taille en points d'une police.
ce lien peut vous aider http://jontangerine.com/log/2007/09/the-incredible-em-and-elastic-layouts-with-css
Comme cité dans cet article:
Nous savons que 1em est toujours égal à la taille de police de l'élément parent, donc:
1 ÷ parent font-size × required pixel value = em valuePour vos signets: table de conversion Pixel en ems pour les tailles de police.
em est presque le même que le pourcentage, je suggère de lire http://kyleschaeffer.com/best-practices/css-font-size-em-vs-px-vs-pt-vs/