Rekomendasi kursus：

Fungsi CSS clamp()

Definisi dan penggunaan CSS clamp() Fungsi ini digunakan untuk menetapkan nilai yang akan berubah sesuai dengan ukuran viewport antara nilai minimum dan nilai maksimum.

clamp() Fungsi ini memiliki tiga parameter: nilai minimum, nilai yang dipilih terutama, dan nilai maksimum. Jika nilai yang dipilih terutama berada dalam rentang yang ditentukan, pereksi akan memilih nilai yang dipilih terutama; jika tidak, pereksi akan memilih nilai minimum atau nilai maksimum.

Contoh

Tetapkan ukuran huruf minimum elemen <h1> menjadi 2rem, dan ukuran huruf maksimum menjadi 3.5rem. Pula, tetapkan ukuran huruf minimum elemen <p> menjadi 1rem, dan ukuran huruf maksimum menjadi 2.5rem：

h1 {
  font-size: clamp(2rem, 2.5vw, 3.5rem);
}
p {
  font-size: clamp(1rem, 2.5vw, 2.5rem);
}

Coba sendiri

Sintaks CSS

clamp(min, terpilih, max)

Perincian teknologi

Pemilihan pereksi

Teks di dalam表格menunjukkan versi penuh penggunaan fungsi yang didukung oleh pereksi paling awal.