Calculateur CSS clamp()
Donnez une taille pour un petit viewport et une pour un grand. Vous obtenez le clamp() qui passe de l'un à l'autre en douceur, en rem, pour continuer à respecter la taille de police du lecteur.
Le vif renard brun
Échelle typographique
Pourquoi rem et non px
Une taille en px ignore la taille de police que le lecteur a choisie dans son navigateur. La même déclaration en rem s'y adapte : qui a mis 20px par défaut obtient un texte plus grand au lieu de votre 16 figé. Le terme de viewport reste en vw quoi qu'il arrive — il s'agit de largeur d'écran, pas de préférence de lecture.
FAQ
Que fait le terme du milieu ?
C'est une droite passant par vos deux points : une ordonnée à l'origine plus une pente en vw. Sous le petit viewport elle se bloque au minimum, au-dessus du grand au maximum.
Le maximum peut-il être plus petit que le minimum ?
Oui, et clamp() fonctionne toujours — mais le résultat rétrécit quand l'écran grandit, ce qui n'est presque jamais voulu. La page le signale le cas échéant.
Est-ce que quelque chose est envoyé à vos serveurs ?
Non. C'est de l'arithmétique dans votre navigateur ; rien de ce que vous tapez ne quitte la page.
Réalisé par l'équipe GO AI. Tous les outils gratuits