⭐ 0
🔍
Κείμενο Εικόνα PDF & Έγγραφα Ήχος Μουσική Ηλεκτρονικά Χρόνος Βοηθητικά προγράμματα Επικυρωτές Εσωτερισμός Παιχνίδια

Γεννήτρια Fluid Font Size Clamp().

Υπολογίστε μια πραγματική ρευστή τιμή CSS clamp() από ένα ελάχιστο και μέγιστο μέγεθος σε δύο πλάτη θυρών προβολής, με την κλίση και την τομή να εμφανίζονται βήμα προς βήμα και μια ζωντανή προεπισκόπηση αλλαγής μεγέθους.

Επεξεργασία... 0%

Αποτέλεσμα

Αυτή η σελίδα ανοίγει την αριθμομηχανή με μια ρευστή ρύθμιση μεγέθους γραμματοσειράς γενικής χρήσης που έχει ήδη συμπληρωθεί: 16 εικονοστοιχεία σε θύρα προβολής 320 εικονοστοιχείων έως 24 εικονοστοιχεία σε θύρα προβολής 1280 εικονοστοιχείων. Αυτό είναι ένα άνετο εύρος από σώμα έως ελαφρώς μεγαλύτερο που κλιμακώνεται ομαλά από μια τυπική οθόνη τηλεφώνου σε ένα τυπικό παράθυρο επιφάνειας εργασίας και είναι η ρύθμιση που εννοούν οι περισσότεροι όταν αναζητούν αρχικά ένα ρευστό clamp() μεγέθους γραμματοσειράς.

Οι τέσσερις αριθμοί μπορούν να αλλάξουν: αυξήστε το μέγιστο μέγεθος για μια επικεφαλίδα αντί για το κύριο κείμενο ή περιορίστε το εύρος της θύρας προβολής εάν η σχεδίαση χρειάζεται μόνο να λυγίσει μεταξύ ενός tablet και ενός σημείου διακοπής επιφάνειας εργασίας. Ό,τι κι αν εισαγάγετε, η κλίση και η τομή του άξονα y υπολογίζονται εκ νέου με τον ίδιο τρόπο και εμφανίζονται ως σαφής αριθμητική, όχι κρυμμένη μέσα στην τελική γραμμή.

Κάτω από τις τέσσερις εισόδους, ένα ρυθμιστικό πλάτους προβολής οδηγεί μια ζωντανή προεπισκόπηση, έτσι ώστε η κλιμάκωση να είναι ορατή αμέσως και η γραμμή clamp() που είναι έτοιμη για αντιγραφή να απέχει ένα κλικ. Η εναλλαγή της μονάδας εξόδου μεταξύ rem και px υπολογίζει εκ νέου κάθε αριθμό χωρίς να αγγίξει τις ίδιες τις τιμές ελάχιστου και μέγιστου μεγέθους.

🛡️
Εκτελείται στο πρόγραμμα περιήγησης

Τα αρχεία και οι είσοδοι σας δεν φεύγουν ποτέ από αυτήν τη συσκευή. Η επεξεργασία εκτελείται εντελώς εκτός σύνδεσης. 100% ασφαλής.

Αποδεκτές Μορφές & Κανόνες

  • Πραγματικά μαθηματικά τυπογραφίας ρευστού: κλίση, συντελεστής vw και τομή του άξονα y που φαίνονται ρητά, όχι μόνο η γραμμή τελικής clamp().
  • Ζωντανή προεπισκόπηση: σύρετε το ρυθμιστικό πλάτους θυρίδας προβολής για να παρακολουθήσετε την αλλαγή μεγέθους δείγματος κειμένου ακριβώς όπως θα έκανε όταν αλλάζει το μέγεθος ενός πραγματικού παραθύρου του προγράμματος περιήγησης.
  • Λειτουργία κλίμακας τύπου: ένα μέγεθος βάσης και μια αναλογία από 1,125 έως 1,5 δημιουργούν έξι βήματα υγρού σφιγκτήρα () — small, base, h4, h3, h2, h1 — ως CSS έτοιμο για αντιγραφή.

Βασικά Οφέλη

✓ Η γραμμή clamp(), οι αριθμοί κλίσης και τομής και η ζωντανή προεπισκόπηση ενημερώνονται καθώς πληκτρολογείτε — δεν χρειάζεται να πατήσετε κουμπί.
✓ Ένα ρυθμιστικό πλάτους προβολής οδηγεί ένα πλαίσιο ζωντανής προεπισκόπησης, ώστε να βλέπετε την ακριβή κλιμάκωση του υγρού σε δράση μεταξύ των ελάχιστων και μέγιστων σημείων διακοπής, όχι απλώς ενός τύπου.
✓ Μια ξεχωριστή λειτουργία κλίμακας τύπου μετατρέπει ένα βασικό μέγεθος και αναλογία σε μια πλήρη κλίμακα ρευστών επικεφαλίδων 6 βημάτων, έτοιμη ως μπλοκ προσαρμοσμένων ιδιοτήτων CSS.

Περιπτώσεις χρήσης

  • • Μετατρέψτε το ελάχιστο/μέγιστο μέγεθος γραμματοσειράς και το εύρος της θύρας προβολής σε μια πραγματική γραμμή clamp() — περιλαμβάνεται κλίση, συντελεστής vw και διασταύρωση — αντί να κοιτάξετε ένα από ένα σεμινάριο.
  • • Σύρετε ένα ρυθμιστικό πλάτους θυρίδας προβολής για να κάνετε προεπισκόπηση μιας ρευστής επικεφαλίδας ή μεγέθους σώματος ακριβώς όπως θα αλλάζει το μέγεθος ενός πραγματικού παραθύρου του προγράμματος περιήγησης, πριν το δεσμεύσετε σε ένα φύλλο στυλ.
  • • Δημιουργήστε μια πλήρη κλίμακα ρευστού τύπου 6 βημάτων (μικρή έως h1) από ένα βασικό μέγεθος και αναλογία, που αντιγράφεται ως έτοιμο προς επικόλληση μπλοκ προσαρμοσμένων ιδιοτήτων CSS.
  • • Δημιουργήστε ένα υγρό clamp() για απόσταση (περιθώριο, padding, gap) αντί για μέγεθος γραμματοσειράς — ο ίδιος τύπος κλίσης/τομής ισχύει για οποιαδήποτε ιδιότητα CSS.