⭐ 0
🔍
Tekstas Vaizdas PDF ir dokumentai Garsas Muzika Elektronika Laikas Komunalinės paslaugos Validatoriai Ezoterinis Žaidimai

Skysčių tarpo gnybtas() generatorius

Apskaičiuokite tikrąją skystą CSS clamp() vertę pagal minimalų ir maksimalų dydį per du peržiūros srities pločius, nuolydis ir sankirta rodomi žingsnis po žingsnio ir tiesioginė dydžio keitimo peržiūra.

Apdorojama... 0%

Rezultatas

CSS clamp() veikia lygiai taip pat, kaip tarpai, kaip ir šrifto dydžiui – ypatybė tiesiog yra paraštė, užpildymas arba tarpas, o ne šrifto dydis. Šiame puslapyje atidaromas skaičiuotuvas su 8–32 pikselių diapazonu 320–1280 pikselių peržiūros srityje. Tai įprastas veiksmas, skirtas sekcijų užpildymui arba kortelių tarpams, kurie turėtų būti ankšti telefone ir erdvūs darbalaukyje be medijos užklausos.

Matematikai nesvarbu, ką reiškia skaičiai: ta pati nuolydžio ir y ašies sankirtos formulė, kuri sukuria sklandų antraštės dydį, sukuria skysčio tarpo reikšmę, todėl toliau pateiktas suskirstymas tiksliai parodo, kaip 8 pikseliai ir 32 pikseliai virsta kopijavimui paruošta clamp() linija, skirta užpildymui: clamp (...).

Vilkite peržiūros srities pločio slankiklį, kad peržiūrėtumėte, kaip tarpai atrodytų esant bet kokiam pločiui tarp dviejų lūžio taškų, pakoreguokite minimalias ir didžiausias vertes, kad būtų siauresnis arba laisvesnis diapazonas, ir nukopijuokite baigtą eilutę tiesiai į reikiamą tarpų ypatybę.

🛡️
Vykdoma naršyklėje

Jūsų failai ir įvestis niekada nepalieka šio įrenginio. Apdorojimas vykdomas visiškai neprisijungus. 100% saugus.

Priimami formatai ir taisyklės

  • Tikra skysčių tipografijos matematika: nuolydis, vw koeficientas ir y ašies sankirta rodoma aiškiai, o ne tik galutinė clamp() linija.
  • Tiesioginė peržiūra: vilkite peržiūros srities pločio slankiklį, kad pamatytumėte, kaip pavyzdinis teksto dydis keičiamas tiksliai taip, kaip būtų keičiamas tikrojo naršyklės lango dydis.
  • Tipo mastelio režimas: bazinis dydis ir santykis nuo 1,125 iki 1,5 sukuria šešis skysčio spaustuko () žingsnius – mažas, bazinis, h4, h3, h2, h1 – kaip kopijavimui paruoštą CSS.

Pagrindiniai privalumai

✓ Clamp() linija, nuolydžio ir sankryžos numeriai bei tiesioginė peržiūra atnaujinami vedant tekstą – nereikia spausti mygtuko.
✓ Peržiūros srities pločio slankiklis valdo tiesioginės peržiūros laukelį, todėl matote tikslų skysčio mastelį veikiant tarp min. ir maks. lūžio taškų, o ne tik formulę.
✓ Atskiras tipo skalės režimas vieną bazinį dydį ir santykį paverčia visa 6 pakopų skysčio antraštės skale, paruošta kaip tinkintų CSS ypatybių blokas.

Naudojimo atvejai

  • • Paverskite minimalų / maksimalų šrifto dydį ir peržiūros srities diapazoną į tikrą clamp() liniją (įskaitant nuolydį, VW koeficientą ir sankirtą), o ne žvelgdami į vieną iš mokymo programos.
  • • Vilkite peržiūros srities pločio slankiklį, kad peržiūrėtumėte sklandžią antraštę arba kūno dydžio keitimą tiksliai taip, kaip būtų keičiamas tikrojo naršyklės lango dydis, prieš įtraukdami jį į stiliaus lapą.
  • • Sugeneruokite visą 6 pakopų skysčio tipo skalę (nuo mažos iki h1) iš vieno bazinio dydžio ir santykio, nukopijuotą kaip paruoštą įklijuoti CSS tinkintų ypatybių bloką.
  • • Vietoj šrifto dydžio sukurkite skystą spaustuką () tarpams (paraštė, užpildymas, tarpas) – ta pati nuolydžio / sankirtos formulė taikoma bet kuriai CSS ypatybei.