CSS clamp() generátor
Generáljon egy fluidikus CSS clamp() értéket, amely zökkenőmentesen méretezi magát két nézetablak-szélesség között.
CSS clamp() generátor
A fluidikus tipográfia és térköz egy értéket zökkenőmentesen méretez, ahogy az ablak átméretezően változik, ahelyett, hogy néhány média-lekérdezés töréspont között ugrálna. Ez az eszköz ezt az értéket generálja Önnek: adjon meg egy minimális és maximális méretet, valamint az azokra alkalmazandó nézetablak-szélességeket, és visszakap egy CSS clamp() függvényt a közöttük lévő lineáris interpolációval, amelyet közvetlenül beilleszthet egy stíluslapba.
A minimális méret és maximális méret a skála két végpontját határozza meg; a minimális és maximális nézetablak-szélesség azt jelöli, hogy az egyes végpontok hol lépnek érvénybe – a minimális szélesség alatt az érték az alsó korlát marad, a felett pedig a felső korlát, közöttük pedig lineárisan növekszik a nézetablakkal. Az egység opció a kimenetet px és rem között váltja, a gyökér betűméret pedig a px-ről rem-re való konverziót szabályozza, a tizedesjegyek pedig azt szabályozzák, hogy a generált számok milyen pontosak. A kimenet formátuma ugyanezt a clamp()-et egyszerű deklarációként, CSS egyéni tulajdonságként vagy Tailwind tetszőleges érték osztályként burkolja, így közvetlenül beillesztheti azt bármelyik kódbázisba, amelyen dolgozik.
A hozzáférhetőség-ellenőrzés bekapcsolása megjegyzést ad hozzá, amikor az beállítás problémát okozhat: a px-alapú méretezés figyelmen kívül hagyja az olvasó böngészőbetűméret-beállítását, és egy túl kicsi minimum még a skálázás megkezdése előtt is nehéz olvasható marad. Mindkettő gyakori hiba a kézzel írt fluidikus típus-formulákban, és az eszköz ezeket zöld luz helyett megjegyzi.
Minden számítás a böngészőjében történik, ahogy módosítja a beállításokat – semmi, amit megadna, nem kerül sehova. Ha az eredmény megfelelőnek tűnik, másolja ki, töltse le .txt fájlként, vagy küldje el egy másik eszköz bemenetéhez a munka folytatásához.