⭐ 0
🔍
Szöveg Kép PDF és Dokumentumok Hang Zene Elektronika Idő Segédprogramok Validátorok Ezotéria Játékok

Folyékony betűméret Clamp() generátor

Számítson ki egy valós folyékony CSS clamp() értéket a minimális és maximális méretből két nézetablak szélességében, a lejtőn és a metszésponton lépésről lépésre, valamint élő átméretezési előnézettel.

Feldolgozás... 0%

Eredmény

Ez az oldal megnyitja a számológépet egy már kitöltött általános célú, rugalmas betűméret beállítással: 16 képpont 320 képpontos nézetablakban, legfeljebb 24 képpont 1280 képpontos nézetablakban. Ez egy kényelmes testtől kissé nagyobbig terjedő tartomány, amely zökkenőmentesen skálázható a tipikus telefon képernyőjétől a tipikus asztali ablakig, és ez az a beállítás, amelyre a legtöbben gondolnak, amikor egy folyékony betűméretű bilincs() után keresnek.

A négy szám módosítható: növelje meg a címsor maximális méretét a törzsszöveg helyett, vagy szűkítse a nézetablak tartományát, ha a kialakításnak csak a táblagép és az asztali töréspont között kell mozognia. Bármit is ad meg, a meredekség és az y tengely metszéspontja ugyanúgy újraszámításra kerül, és explicit aritmetikaként jelenik meg, nem pedig az utolsó vonalban.

A négy bemenet alatt egy nézetablak szélességét mutató csúszka mozgatja az élő előnézetet, így a méretezés azonnal látható, a másolásra kész clamp() vonal pedig egy kattintásnyira van. A kimeneti egység rem és px közötti váltása minden számot újraszámít anélkül, hogy megérintené magát a minimális és maximális méretértéket.

🛡️
Böngészőben futtatva

A fájljaid és bemeneteid soha nem hagyják el ezt az eszközt. A feldolgozás teljesen offline módon történik. 100% biztonságos.

Elfogadott formátumok és szabályok

  • Valódi folyadéktipográfiai matematika: a meredekség, a vw együttható és az y-tengely metszéspontja kifejezetten látható, nem csak a végső clamp() vonal.
  • Élő előnézet: húzza el a nézetablak szélessége csúszkát, ha meg szeretné tekinteni, hogy a minta szövege pontosan úgy történik, ahogyan egy valódi böngészőablak átméretezése történik.
  • Típusméretű mód: az alapméret és az 1,125 és 1,5 közötti arány hat fluid clamp() lépést generál – kicsi, alap, h4, h3, h2, h1 – másolásra kész CSS-ként.

Főbb előnyök

✓ A clamp() vonal, a lejtő- és metszéspontszámok, valamint az élő előnézet mind gépelés közben frissül – nincs gombnyomás.
✓ A nézetablak szélességét mutató csúszka egy élő előnézeti mezőt hajt meg, így a minimális és maximális töréspontok közötti pontos áramlási skálázást láthatja, nem csak egy képletet.
✓ Egy külön típusskála mód egy alapméretet és arányt egy teljes, 6 lépcsős folyadékfejléc-skálává alakít, amely készen áll az egyéni CSS-tulajdonságok blokkjára.

Felhasználási területek

  • • Változtassa meg a minimális/maximális betűméretet és a nézetablak-tartományt valódi clamp() vonallá – a lejtőt, a vw-együtthatót és a metszéspontot is beleértve – ahelyett, hogy egy oktatóanyagból szemezgetne.
  • • Húzza el a nézetablak szélességét mutató csúszkát, hogy megtekinthesse a gördülékeny fejléc vagy törzsméret átméretezését, pontosan úgy, ahogyan egy valódi böngészőablak átméretezése közben történik, mielőtt stíluslapon rögzítené.
  • • Hozzon létre egy teljes, hatlépcsős folyadéktípus-skálát (kistől h1-ig) egyetlen alapméretből és arányból, amelyet az egyéni CSS-tulajdonságok beillesztésre kész blokkjaként másol.
  • • Hozzon létre egy fluid clamp()-t a térközhöz (margó, kitöltés, hézag) a betűméret helyett – ugyanaz a lejtő/metszésképlet vonatkozik minden CSS-tulajdonságra.