Kalkulator CSS clamp()
Masukkan saiz untuk skrin kecil dan besar dan dapatkan nilai clamp() bendalir yang diskalakan dengan lancar di antaranya — untuk saiz fon, padding, margin atau gap.
clamp(1rem, 0.8333rem + 0.8333vw, 1.5rem)Hasil mengekalkan bahagian rem dalam sebutan tengah, jadi teks masih membesar apabila seseorang mengezum ke 200% — nilai viewport sahaja tidak akan berbuat demikian.
Teks bendalir, saiz yang tepat.
Pengiraan dijalankan sepenuhnya dalam penyemak imbas anda. Tiada apa-apa yang anda masukkan di sini akan dimuat naik ke BroBroGo.
Soalan Lazim
Bagaimanakah kalkulator membina nilai clamp()?
Anda memberikan dua titik: saiz pada lebar skrin kecil dan saiz pada skrin besar. Ia melukis garis lurus di antaranya supaya saiz membesar dengan lancar apabila skrin melebar, kemudian membungkusnya dalam clamp() supaya ia tidak pernah jatuh di bawah saiz skrin kecil anda atau meningkat melebihi saiz skrin besar anda. Di antara dua lebar tersebut, saiz diskalakan secara bendalir; di luarnya, ia kekal pada had terdekat.
Mengapakah hasilnya dalam rem dan vw dan bukannya piksel?
Sempadan adalah dalam rem dan bahagian tengah yang berubah mengekalkan komponen rem, jadi teks masih membesar apabila pembaca mengezum masuk atau meningkatkan saiz fon lalai penyemak imbas mereka — nilai piksel atau viewport sahaja boleh menghalang fungsi ini daripada berfungsi. Anda menaip saiz dalam piksel kerana begitulah cara kebanyakan orang memikirkannya, dan alat ini menukar kepada rem menggunakan saiz fon akar anda.
Bolehkah saya menggunakan ini untuk jarak, bukan hanya saiz fon?
Ya. Nilai yang sama berfungsi untuk padding, margin, gap, lebar atau tinggi — di mana-mana sahaja panjang digunakan. Tukar pratonton kepada Kotak untuk melihat jarak membesar dan bukannya teks. Jika saiz kecil dan besar anda adalah sama, hasilnya akan mengecil kepada panjang tetap biasa, kerana tiada apa yang perlu diskalakan.
Adakah semua penyemak imbas menyokong clamp()?
Ya — setiap penyemak imbas semasa telah menyokong clamp() sejak 2020, jadi anda boleh menggunakan nilai tersebut seadanya tanpa sandaran. Pada maksimum yang sangat besar atau kadar perubahan yang cepat, adalah wajar untuk membuat semakan pantas pada zum 200% bagi memastikan teks masih membesar untuk pembaca yang memerlukannya.