Les pubs vous déplaisent ? Aller Sans pub Auj.

Convertisseur Pixel / REM / EM (Unités CSS)

PromoteurTexte
PUBLICITÉ · RETIRER?

Presets

Paramètres

Utilisé pour le calcul EM (EM est relatif à la taille de police de l'élément parent)

Unités de fenêtre d'affichage

Fenêtre d'affichage vw vh
360px (Mobile)
768px (Tablette)
1280px (Ordinateur portable)
1920px (Ordinateur de bureau)

Tableau de référence

Pixels REM EM PT
8px
10px
12px
14px
16px
18px
20px
24px
32px
48px
64px
PUBLICITÉ · RETIRER?

Guide

Convertisseur Pixels / REM / EM (Unités CSS)

Convertisseur Pixels / REM / EM

Convertissez instantanément entre les unités CSS : pixels (px), root em (rem) et em. Ajustez la taille de police de base et regardez toutes les valeurs se mettre à jour en temps réel. Parfait pour les développeurs front-end traduisant les spécifications de conception en CSS.

Comment utiliser

Entrez une valeur dans l'un des trois champs d'unités — px, rem, ou em — et les deux autres se mettront à jour instantanément. Ajustez la taille de police de base (par défaut 16px) à l'aide du curseur ou du champ de saisie pour qu'elle corresponde à la taille de police racine de votre projet. Le tableau de référence ci-dessous montre les conversions courantes en un coup d'œil.

Caractéristiques

  • Conversion bidirectionnelle – Modifiez px, rem ou em et tous les autres se mettent à jour instantanément
  • Taille de police de base réglable – Le curseur et le champ de saisie se synchronisent, par défaut 16px
  • Tableau de référence – Tailles courantes calculées automatiquement pour votre taille de police de base
  • Mises à jour en temps réel – Entrée limitée pour des performances fluides
  • Côté client uniquement – Aucune donnée envoyée à un serveur

PUBLICITÉ · RETIRER?

FAQ

  1. Quelle est la différence entre rem et em en CSS ?

    rem (root em) est relatif à la taille de police de l'élément racine (html), ce qui le rend cohérent sur toute la page. em est relatif à la taille de police de l'élément parent, ce qui peut se composer dans les éléments imbriqués. rem est généralement préféré pour la cohérence de la mise en page.

  2. Pourquoi 1rem est-il égal à 16px par défaut ?

    Les navigateurs définissent une taille de police racine par défaut de 16px, sauf indication contraire. Donc 1rem = 16px, 0.5rem = 8px, 1.5rem = 24px. Si vous définissez html { font-size: 62.5%; }, alors 1rem = 10px, ce qui facilite les calculs.

  3. Quand dois-je utiliser px au lieu de rem ou em ?

    Utilisez px pour les valeurs qui ne doivent pas évoluer avec les préférences de police de l'utilisateur, comme les bordures, les ombres ou les points de rupture des requêtes média. Utilisez rem pour les tailles de police et l'espacement afin que votre mise en page respecte les paramètres d'accessibilité de l'utilisateur. Utilisez em pour le dimensionnement relatif aux composants.

  4. Comment le zoom du navigateur affecte-t-il les unités CSS ?

    Le zoom du navigateur met à l'échelle toutes les unités CSS proportionnellement, y compris px. C'est différent de la mise à l'échelle du texte au niveau du système d'exploitation. Cependant, si un utilisateur modifie la taille de police par défaut de son navigateur, les valeurs rem et em s'ajustent tandis que les valeurs px ne le font pas — ce qui rend rem/em meilleurs pour l'accessibilité.

Envie d'une expérience sans pub ? Passez à la version sans pub

Installez nos extensions

Ajoutez des outils IO à votre navigateur préféré pour un accès instantané et une recherche plus rapide

Sur Extension Chrome Sur Extension de bord Sur Extension Firefox Sur Extension de l'opéra

Le Tableau de Bord Est Arrivé !

Tableau de Bord est une façon amusante de suivre vos jeux, toutes les données sont stockées dans votre navigateur. D'autres fonctionnalités arrivent bientôt !

PUBLICITÉ · RETIRER?
PUBLICITÉ · RETIRER?
PUBLICITÉ · RETIRER?

Coin des nouvelles avec points forts techniques

Impliquez-vous

Aidez-nous à continuer à fournir des outils gratuits et précieux

Offre-moi un café
PUBLICITÉ · RETIRER?