Valeur de 1 rem (16 px par défaut dans les navigateurs).
Laissez vide pour utiliser la taille de base.
floobits.com
floobits.com
🌐 Web et technique
Passez de px à rem, em et pt dans les deux sens, en réglant la taille de police racine et celle de l'élément parent.
Par Jimenez Julien, éditeur de Floobits.com · mis à jour le
En CSS, le pixel est une unité absolue de l'écran, alors que le rem et l'em sont relatifs à une taille de police. Le rem prend pour référence la taille de police de l'élément racine (html), 16 px par défaut dans la plupart des navigateurs. L'em, lui, se rapporte à la police de l'élément parent, ce qui fait que des valeurs en em imbriquées se multiplient entre elles. Le point (pt), utilisé en typographie et à l'impression, vaut 1/72 de pouce, soit 0,75 px.
Les formules sont simples : rem = px / taille de base, em = px / taille du parent et pt = px x 0,75. Régler la taille de base permet de convertir un projet dont la racine n'est pas à 16 px, par exemple 10 px pour faciliter les calculs. Utiliser des rem pour les tailles de texte et les espacements améliore l'accessibilité, car l'interface suit alors le réglage de taille de texte choisi par la personne dans son navigateur.
Par défaut 16 px, car la police racine des navigateurs est de 16 px. Si le site modifie la taille de html, 1 rem prend la nouvelle valeur.
Le rem est plus prévisible pour les tailles de texte et les marges, car il ne dépend que de la racine. L'em convient quand une dimension doit suivre la taille de police locale, comme le padding d'un bouton.
Parce que 1 pt vaut 1/72 de pouce et 1 px vaut 1/96 de pouce en CSS. Le rapport est donc de 4/3 : 12 pt correspondent à 16 px.