Προτεινόμενα μαθήματα:

CSS clamp() συνάρτηση

Ορισμός και χρήση του CSS clamp() Η συνάρτηση χρησιμοποιείται για να ρυθμίσει μια τιμή που θα προσαρμόζεται αυτόματα μεταξύ της ελάχιστης και της μέγιστης τιμής ανάλογα με το μέγεθος του视口.

clamp() Η συνάρτηση έχει τρεις παραμέτρους: την ελάχιστη τιμή, την προτιμώμενη τιμή και τη μέγιστη τιμή. Αν η προτιμώμενη τιμή βρίσκεται εντός του καθορισμένου διαστήματος, ο περιηγητής θα επιλέξει την προτιμώμενη τιμή; αλλιώς, ο περιηγητής θα επιλέξει την ελάχιστη ή τη μέγιστη τιμή.

Παράδειγμα

Ρυθμίστε το ελάχιστο μέγεθος γραμματοσειράς του στοιχείου <h1> σε 2rem και το μέγιστο μέγεθος γραμματοσειράς σε 3.5rem. Ταυτόχρονα, ρυθμίστε το ελάχιστο μέγεθος γραμματοσειράς του στοιχείου <p> σε 1rem και το μέγιστο μέγεθος γραμματοσειράς σε 2.5rem:

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

Προσπάθησε να το δοκιμάσεις شخصικά

Γλωσσική δομή CSS

clamp(min, preferred, max)

Τεχνικά λεπτομέρειες

Υποστήριξη περιηγητή

Τα αριθμήματα στη τάβλη αναφέρονται στην έκδοση του προγράμματος περιήγησης που υποστηρίζει πλήρως τη συνάρτηση.