Kalkulator za CSS clamp()
Vnesite velikost za male in velike zaslone ter pridobite tekočo vrednost clamp(), ki se vmes gladko prilagaja — za velikosti pisav, paddinge, margine ali gape.
clamp(1rem, 0.8333rem + 0.8333vw, 1.5rem)Rezultat ohranja del rem v srednjem členu, zato se besedilo še vedno poveča, ko uporabnik poveča prikaz na 200 % — vrednost, ki temelji samo na viewportu, tega ne omogoča.
Tekoče besedilo, popolno prilagojeno.
Izračun poteka v celoti v vašem brskalniku. Nič od tega, kar vnesete tukaj, se ne prenaša na BroBroGo.
Pogosta vprašanja
Kako kalkulator sestavi vrednost clamp()?
Določite dve točki: velikost pri majhni širini zaslona in velikost pri veliki širini. Kalkulator med njima nariše ravno črto, tako da velikost nemoteno raste z večanjem zaslona, nato pa jo ovije v funkcijo clamp(), da nikoli ne pade pod velikost za majhen zaslon ali preseže velikost za velik zaslon. Med obema širinama se velikost prilagaja tekoče; zunaj njiju pa se zadrži na najbližji meji.
Zakaj je rezultat v enotah rem in vw namesto v slikovnih pikah?
Meje so izražene v rem, spreminjajoči se srednji del pa ohranja komponento rem, zato besedilo še vedno raste, ko bralec poveča prikaz ali spremeni privzeto velikost pisave v brskalniku — vrednost v slikovnih pikah ali samo v viewport enotah (vw) lahko to prepreči. Velikosti vnašate v slikovnih pikah, ker večina ljudi razmišlja v njih, orodje pa jih pretvori v rem na podlagi vaše korenske (root) velikosti pisave.
Ali lahko to uporabim tudi za razmike in ne le za velikost pisave?
Da. Isti princip deluje za padding, margin, gap, širino ali višino — povsod, kjer se uporablja dolžina. Preklopite predogled na Polje (Box), da opazujete, kako raste razmik namesto besedila. Če sta vaša najmanjša in največja velikost enaki, se rezultat zmanjša na navadno fiksno dolžino, saj ni ničesar za prilagajanje.
Ali vsi brskalniki podpirajo clamp()?
Da — vsi sodobni brskalniki podpirajo clamp() že od leta 2020, zato lahko vrednost uporabite neposredno brez nadomestnih rešitev (fallback). Pri zelo velikih maksimumih ali hitrih spremembah je priporočljivo na hitro preveriti pri 200-odstotni povečavi, ali se besedilo še vedno ustrezno poveča za bralce, ki to potrebujejo.